Homile

📌 일주일간 다양한 내용을 학습할 수 있었고 알고 있는 내용에서 놓쳤던 부분을 매꿀 수 있어서 좋은 기간이었다.

📗 일주일간 학습한 내용

Git

• clone: repository를 받아온다.
• fork: repository를 내 github에 복사한다.
• pull
• push
• add
• commit

node.js

• npm
• nvm
• mocha
• chai

배열

• 순서가 있는 데이터의 저장공간

객체

• 속성과 속성 값이 있는 저장공간

복사

• 얕은 복사
• 깊은 복사

자료형

• 원시 자료형
• 참조 자료형

스코프

• 변수의 유효 범위

클로저

• 함수를 리턴하는 함수
• 외부 함수와 내부 함수가 존재
• 외부 함수의 변수는 내부 함수에서 참조 가능하지만 반대로는 불가능

ES6 신규 문법

• Spread: ...배열 or ...객체

구조분해할당

• 배열 및 객체를 분해 한 후 새 변수에 할당하는 것(Spread 사용)

이번주는 다양한 것을 깊게 배울 수 있는 시간이었고, 다양한 사람들을 만나면서 다양한 풀이를 볼 수 있게 되어 의미있는 기간이 되었다.
아직까지는 내가 아는 것이 조금은 더 많다고 생각하지만 그렇다고 멈춰서있게 되면 내가 발전 할 수 없고 실력은 따라잡히기 마련이 다 절대 자만하지 않도록 하는 것이 이 과정을 끝까지 의미있게 진행 할 수 있다고 생각한다.

📘 다음주간 공부할 내용

Git & Github

• 아고라스테이츠 클론 작업

DOM

• Element 조작 방법

RestAPI

• RestAPI란 무엇인가?

(Test-Driven Development, TDD)

git과 github의 사용방법에 대해서 아고라스테이츠 클론 작업을 통해 배울 수 있을 것 같다.

DOM을 사용하여 이벤트 출력 및 요소의 구조확인, 구조변경 등을 진행한다.

RestAPI는 아직은 배우지 않지만 시간이 조금 많이 남는다면 추가적으로 공부를 진행하려고 한다.

📝 일주일 간 느낀 점 & 마음 가짐

• Koans를 하면서 직접 예제를 가지고 페어분께 설명을 드리며 나도 기술 면접을 준비하는 듯한 느낌이 들고 설명하는 기술이 늘어 좋은 시간이 되었다.
• 시간이 남는다면 놀지 말고 정해진 시간 +2시간 정도는 공부를 더 해보자!!

📌 다른 캠프의 지인도 열심히 하는 것을 보며 나도 열심히 해야겠다고 생각을 하는 날이 되었다.

📗 오늘 학습한 내용

JavaScript

• 스코프, 클로저 내용 정리

GraphQL

• 페이스북에서 만든 쿼리 언어
• 웹 클라이언트가 데이터를 서버로 부터 효율적으로 가져오는 것을 목적으로 둔다.
• REST API와 비교
• GraphQL의 구조

Python 알고리즘 문제풀이

• [Leectcode] Remove Element
• [Leectcode] Search Insert Position
• [Leectcode] Container With Most Water

주간에 배운 스코프와 클로저에 대해 자세히 정리하였다.

알고리즘 스터디 중 나온 GraphQL에 대한 내용을 개발자가 되기위해 공부해야 한다고 생각하여 추가적으로 공부하였다. GraphQL은 React와 같이 페이스북에서 개발한 아키텍처이란 것을 알고 React를 사용하기 위해서는 같은 회사에서 개발한 GraphQL이 호환성이 확실히 좋다고 생각이 든다.

📘 추가로 공부할 내용

JavaScript

• React
  • React와 vue의 차이
• Graphql
  • GraphQL과 Rest의 차이

위와 같은 프레임워크, 라이브러리를 사용했을때, 왜 사용하는지 정확하게 누군가에게 전달할 수 있도록 공부를해보자.

📝 오늘 느낀점 & 마음 가짐

• 프레임워크, 라이브러리를 조금 더 공부해보자.
• JavaScript와 TypeScript의 관계에 대해 공부해보자.
• 앞으로 정해진 것만 하지말고 한발더 나아가 보자!!!!

📌 이제 section 마지막에 다가오니 기분이 묘하다... 앞으로 더 열심히 해야지!!

📗 오늘 학습한 내용

JavaScript

• 클로저
  • 함수에 함수가 선언되어 return하는 구조이다.
  • 클로저함수: 외부함수의 매개변수에 접근할 수 있는 내부함수
  • 특징
    • 데이터의 보존
    • 정보의 접근 제한(캡슐화)
    • 모듈화
  • 외부함수
    • 외부함수에 선언된 변수는 내부함수에서 접근이 가능하다.
  • 내부함수
    
    • 내부함수에 선언된 변수는 외부함수에서 접근이 불가능하다.
• ES6 신규 문법
  • Spread
  • rest
• 3주간 배웠던 내용 종합 퀴즈

스코프, 클로저의 개념은 조금 어려울 수 있다. 내부함수, 외부함수, 외부함수의 변수 등 다양하게 데이터가 이리저리 움직인다고 생각하기 때문이다. 이럴때는 천천히 그림을 그려보면서 흐름을 이해하면 쉽게 할 수 있다는 것을 적고 싶었다.

그리고 ES6문법의 경우 많이 사용해봤던 부분이라 코플릿 배열, 객체 문제를 풀 때에도 사용했던 적이 있었는데 깊은 사용법까지는 자세히 몰랐으나 알게되었다.

📘 추가로 공부할 내용

JavaScript

• DOM
• Graphql

📝 오늘 느낀점 & 마음 가짐

• 다양한 프론트엔드 지식에 대해 조금 더 알아보자!
• 따라 잡히지 않도록 조금 더 나아가자!!

📌 오늘은 결국 몸살이나서 조금 힘들었지만 최대한 오늘 정해진 학습과정을 견뎌냈고, 추가로 복습, 예습까지 진행했다. 대신 빨리하고 쉬어야 할 것이라 생각해서 평소보다는 학습을 못한것은 주말에 채워야겠다. 몸건강이 우선이다!!!

📗 오늘 학습한 내용

JavaScript

• 원시자료형
  • 고정된 저장 공간을 차지하는 데이터
  • number, string, boolean, undefined, ,symbol, (null)
  • 하나의 변수에 하나의 데이터만 들어간다.
  • 변수를 복사하여 사용해도 원본은 변경되지 않는다.
• 참조자료형
  • 대량의 데이터를 다루는 배열(Array)과 객체(Object)
  • 함수(function)
  • 데이터를 저장 공간에 넣는 것이 아닌 주소를 할당한다.
  • 저장 공간을 복사 할 경우 복사한곳의 데이터를 변경할 경우 원본도 변경된다.
• 스코프
  • 전역 스코프
    • 전역 스코프는 말그대로 global 적으로 사용이 가능하다.
  • 지역 스코프
    • 지역 스코프는 한 블록에서만 사용이 가능하고 벗어날 수 없다.
  • var, let, const
• 클로저
  • 함수에 함수가 선언되는 구조이다.
  • 특징
    • 데이터의 보존
    • 정보의 접근 제한(캡슐화)
    • 모듈화
  • 외부함수
  • 내부함수
  • 외부함수에 선언된 변수는 내부함수에서 접근이 가능하다.
  • 내부함수에 선언된 변수는 외부함수에서 접근이 불가능하다.

📘 추가로 공부할 내용

JavaScript

• 클로저
• ES6 신규 문법

📝 오늘 느낀점 & 마음 가짐

• udemy JS 알고리즘 공부를 다시 해보자!!
• 몸 건강이 우선이다!! 체력을 길러야 겠다!!

📌 개인적인 이슈가 생겨서 많이 힘들었던 날이다...

📗 오늘 학습한 내용

JavaScript

• 객체
  • 객체의 속성과 속성값
  • for (let key in obj)
    • 객체에 있는 속성을 변수 key에 할당
  • for (let [key, value] of Object.entries(obj)
    • 객체에 있는 속성을 변수 key에 할당, 속성의 값은 value에 할당
• 원시자료형
  • 고정된 저장 공간을 차지하는 데이터
  • number, string, boolean, undefined, null
• 참조자료형
  • 대량의 데이터를 다루는 배열(Array)과 객체(Object)

배열은 사용할때 순차적으로 나와 구별하기 쉬웠지만, 객체의 경우 속성과 속성의 값을 둘다 변경하거나 삭제, 비교를 해야하는 과정에서 조금 헷갈렸던 것 같다. 코플릿으로 객체에 대한 문제를 풀면서 처음에는 쉬운 객체를 다루는 방법에 대해 나와있었지만 후반으로 갈 수록 여러가지 객체를 이용하여 푸는 문제에서 조금 신경을 써서 풀어야했다.

이때, !(부정)을 사용할 때 ()을 사용하지 않아 하나의 값만 부정하는 경우를 발생했는데 페어분이 알아내셔서 바로 수정하여 결과를 도출할 수 있었다. 이런부분에서 나는 꼼꼼하게 체크를 하지 않아 다양한 풀이를 생각했지만 의외로 간단한 부분에서 실수가 난다는 것을 다시 한번 인지하고 다음에는 조금 더 꼼꼼히 코드를 살펴볼 수 있도록 해야겠다.!!

📘 추가로 공부할 내용

JavaScript

• 스코프
• 클로저
• JSON을 JavaScript의 배열로 변환하는 방법

📝 오늘 느낀점 & 마음 가짐

• 프론트엔드로 가기에는 내 맥북이 버티질 못하겠다..... 구매를 생각하자!
• 딥다이브를 오랜만에 한번더 정독해서 전문적 언어를 사용하자!!
• 이제  Section 1의 종료가 얼마 남지 않았는데 한달간의 회고를 작성할 수 있도록 메모해보자!

📌 날씨가 쌀쌀해서 공부하기 정말 좋다!!

📗 오늘 학습한 내용

JavaScript

• 배열
• 객체
• 스택, 덱, 데큐 자료구조
• [baekjoon]문제풀이

알고리즘 풀이에서 가장 많이 쓰이는 배열과 객체에 대해서 학습을 진행하였다. 값을 할당하는 방법, 재할당, 사용법에 대해서 다시 짚고 넘어갈 수 있는 계기가 되었다.

배열과 객체를 배우게 된다면 당연히 알게되는 스택, 덱, 데큐 자료구조가 있는 데 이것은 이미 Python 알고리즘 스터디를 통해 알고 있는 내용이었다. 이것을 JS형식으로 고쳐서 블로그에 게시하면 나와 동기들에게 도움을 줄 수 있지 않을까 하는 마음으로 정리를 하고 있지만 제대로된 내용을 전달하기 위해 공식문서와 다양한 논문들을 찾아보고 내 글에서 잘 못된 점을 찾으면서 블로그에 게시해봐야겠다.

또한, 다른 알고리즘들도 빠르고 정확하게 JS형식으로 바꿔서 정리해봐야 겠다는 것을 느끼게 되었다.

프론트엔드 개발자로 취직하기 위해서는 사실 구현과제가 가장 중요하다고 생각했지만 결국 알고리즘 테스트를 보는 회사들이 점점 많아지고 있다. 아마 문명의 발달에 따라 다양한 개발 강의 콘텐츠가 쏟아져 나오고 있으니 판별해 내는데 가장 적합한 시스템이지 않나라고 나 자신도 생각하고 있다. 그렇기 때문에 구현도 중요하지만 알고리즘도 꼭 빼두지 않고 열심히 공부해 나가야겠다!!!

📘 추가로 공부할 내용

JavaScript

• 원시자료형
• 스코프
• 클로저

이제 JavaScript의 심화과정을 학습하게 되니 뒤쳐지지 않도록 복습과 예습을 꾸준히 하자!!!

📝 오늘 느낀점 & 마음 가짐

• 복습!! 예습!!!
• 자존감이 떨어지면 오래가지 못한다. 나는 잘 하고 있다!!!