2020.11.28(토) 개발 일지

09:00~12:30

1. 아침부터 동기와 대화한 내용이다.(0900~0930)

네이버 지원서 양식을 토대로 어떤식으로 포트폴리오를 준비 해나가야할지 서로 의견을 나눠봤다.

지금 현재 내가 어떤 방향으로 준비해나가야 하는지를 생각정리 해볼 수 있던 시간이었다.

꼭... 성과를 만들고 기록해서 증명해야지...

얘를들면 -> 예를들면(오타입니다)

 

2. 노마드코더 바닐라JS 챌린지(0930~1000):

day 5 과제(Assignment 5) 정답코드 확인 및 회고

day 6 과제(Today's Assignment) 진행 중

바닐라JS 2주완성 챌린지 진행 현황

 

3. NHN godo 코딩테스트 참여(10:00 ~ 12:30)

3.1. 1,4번 풀고 2번 끝까지 매달리다 시험종료 (3,5번 건드리지도 않음)

3.2. 평소에 준비없이 봐서 그런지 매우 어려웠다. 요즘 포트폴리오 우선으로 준비하고 있어서 그런건데 경험 삼아 봤다고 위안 삼아야지

3.3. (12:53에 작성) 아 2번 문제.. 정답 담아 놓은 배열을 구해놓고 .. 반환을 안했네... return min(answer_list) 했으면 정답인데... 아쉽다... 하지만 이것도 곧 실력이겠지... 평소에 해놨으면 시험시간에 떠올렸을거야... 평소에 안했으니 실력탓...

 

NHN godo 코딩테스트 초대 이메일

13:00 ~ 16:00

1.     노마드코더 바닐라JS 2주 완성 챌린지:

1.1. Assignment 6 끝(~14:30)

1.2. 과제 제출 후 내 깃허브에도 코드 업로드 완료(private). Commit을 어떤 단위로 끊어서 해야할지, 어떻게 message를 작성 해야할지 고민하면서 과제를 진행하다보니 좀 더 코드를 생각하고 짜게 된다. 코드를 생각나는대로 막 짜면 Commit message 작성도 어려워지니까 심사숙고하는 느낌? 아 그리고 깃허브 업로드 과정에서 .gitignore를 사용해보았다. 존재는 알고있었지만 스스로 사용해본건 처음이다. (다른 튜토리얼 강의 따라하며 써본적은 있음). 계속 .DS_Store라는 파일이 혼자 생성되서 깃관리를 성가시게 했는데 .gitignore안에 작성해놓으니 이제 신경 쓸 필요가 없어졌다.

 

2.     노마드코더 코코아톡 클론 14:40 ~ 16:00 (27% completed)

코코아톡 클론코딩 코스 진행현황

17:00 ~ 20:00

1. 노마드코더 코코아톡 클론코딩 수강(css section)

1.1. Position: absolute, relative, fixed , static

1.2.Display: flex, block, inline

1.3.Margin, padding, border

1.4.pseudo selector(div:first-child, div:nth-child(n))

1.5.combinations(>, + div p, div + p, div > p))

1.6.attribute selector: input:required, input[type=”password”], input[placeholder~=”username”], input::placeholder, p::selection

1.7.state: (hover, focus, visted, focus-within), state의 조합으로 특정 조건에서만 css가 발생하도록 설정할 수도 있다.

1.8. class를 지정하지 않아도 css만으로 지정하다는 사실을 알 수 있다. 외우려하진말고 존재여부에 대해 알았다는 것에 의미부여하자. (나중에 MDN에서 참고할 수 있게 됨)

1.9. css custum property(:root, --main-color), css에서 변수를 사용할 수 있다

 

2.     VSC

2.1. alt을 누르면서 커서를 찍으면 여러 개의 커서가 생성되서 동일한 내용을 타이핑할 때 편하다

2.2. 특정 문자열을 드래그한 후에 cmd+d를 누르는 횟수에 따라 동일한 내용에 대해 컨트롤 할 수있게 된다

css의 position: absolute, position: relative에 대해 배우는 중

코코아톡 클론코딩 코스 진행현황

 

21:00~24:00

1.   노마드코더 코코아톡 클론코딩 수강

1.1.         Transition, transformation, animation, media query

 

transtion과 transform으로 이미지에 animation을 만들었다. 이걸 CSS만으로 할 수 있다니

 

화면 크기에 따라 CSS 효과를 적용할 수 있다. 반응형 웹사이트에서 적용할 기능인거 같다.

1.2.         Git & Github

1.3.        (드디어 이론 파트 끝!ㅜ) 실습파트 (클론코딩) 시작! (remote repository 생성)

가운데 보이는 png파일을 클론하고 있다. 왼쪽 하단에 git log가 보인다. css BEM을 준수한 class naming도 (작지만) 보인다

1.4.         CSS 네이밍도 막하는게 아니라 BEM(Blocks Element Modifiers)라는 규칙이 있다. (status, status__column, status—big) -> 가독성 증가

CSS BEM naming

1.5.         Status bar에 사용할 icon html 코드를 fontawesome이라는 사이트에서 복사해왔다.

---

 

오늘 -11월 28일 토요일- Visual Studio Code를 다룬 시간

진행 현황 - 27%에서 57%까지 진행했다!!