Today I Learned
- 웹 퍼블리싱 강의 수강
- git 특강 수강
- firebase 실시간 강의 수강
git 특강
git 비교하기
$ git diff 현재 작업 디렉터리에서의 작업 내역과 최신 커밋을 비교하기
git 되돌리기
revert: 작업을 취소한 새로운 커밋을 생성함 (기존의 커밋 내역은 유지됨)
$ git revert <취소할커밋>
reset: 특정 커밋으로 되돌아가기 (기존의 커밋 내역에 영향이 갈 수도 있음)
soft reset: 커밋을 했다는 사실만을 되돌리기
$ git reset --soft <되돌아갈 커밋>
mixed reset: 스테이지에 추가했다는 사실까지 되돌리기
$ git reset --mixed <되돌아갈 커밋>
hard reset: 변경사항을 만들었다는 사실까지 되돌리기 (작업 디렉토리까지 되돌리기)
$ git reset --hard <되돌아갈 커밋>
Branch로 나누어 관리하기
HEAD: 현재 작업 중인 브랜치의 최신 커밋
checkout: 특정 브랜치에서 작업할 수 있도록 브랜치 변경 (HEAD도 수정됨)
$ git branch <브랜치이름> 새로운 브랜치 생성하기
$ git checkout <브랜치이름> 해당 브랜치로 체크아웃하기
$ git checkout -b <브랜치이름> 새로운 브랜치를 만듦과 동시에 체크아웃하기
$ git merge <브랜치이름> 브랜치 병합하기
Pull Request로 협업하기
1. 기여하려는 저장소를 본인의 계정으로 fork하기
2. fork한 저장소를 clone하기
3. 브랜치 생성 후 생성한 브랜치에서 작업하기
4. 작업한 브랜치 Push 하기
5. Pull Request 보내기
웹 퍼블리싱 강의 내용
반응형(responsive) 웹이란?
한 개의 웹 사이트에서 PC, 태블릿, 스마트폰 등 다양한 디스플레이 종류에 따라 화면과 요소 크기가 자동으로 재조정되는 것을 의미한다. 반대되는 의미로는 고정형 웹이 있으며 최근에는 네이버처럼 고정형 웹으로 개발되는 사례도 많다.
코드 예시
@media (max-width: 740px) {
.login-form-wrapper {
max-width: initial;
height: 100%;
display: flex;
justify-content: center;
padding: 20px;
border-radius: 0;
}
}background-color 투명도 조절하기
background-color: rgba(0,0,0,.75);0,0,0은 black을 의미 맨 뒤의 .75 부분에서 숫자를 조절해서 불투명도를 설정할 수 있다.
버튼 누를 때 새로고침 막기
<script>
// 로그인 버튼 누를때 redirect 막기
$('.login-button').on('click', e => {
e.preventDefault();
});
</script>
느낀 점
오늘은 오랜만에 git을 공부했다. zoom 녹화본으로 git 특강을 올려주셨지만 3시간이 넘어가는 분량에 인프런 git 강의에서 내가 필요한 부분만 찾아서 보았다. (강민철 튜터님이 첫 git 특강 때 인프런 git 강의 무료로 열어주심🥰) 인프런에서 커밋 되돌리기와 branch 부분 강의를 집중적으로 보고 zoom 영상에서는 pull request 부분만 봤다. 그리고 오후에 팀원들과 팀 프로젝트에 대비하여 레파지토리에 브랜치를 만드는 연습을 해봤다. 소스트리를 처음으로 설치해서 사용해봤는데 편하고 좋았다. git은 아직 개념 위주로 공부하고 실제로 해본 것은 많이 없지만 이번 팀 프로젝트를 통해서 git에 더 익숙해질 거라고 기대하고 있다.
오늘 3시간 가까이 firebase 특강이 있었는데 앞부분은 이해하다가 코드 리뷰를 해주시는 부분부터 머리가 아파왔다. 스파르타에서 지금까지 제공해주던 강의들에 비해 수준이 갑자기 확 뛰어오른 느낌. 로그인 기능에 CRUD까지 우리가 과연 1주일 안에 구현할 수 있을까? 그리고 오늘도 강의 중에 DOM이라는 단어가 들려서 또 검색해 봤는데 검색할 때마다 무슨 뜻인지 전혀 이해가 안 된다. 누가 나한테 DOM이 뭔지 이해시켜 줄 사람..?