SECTION 1 회고

2021. 9. 30. 12:04·SE Bootcamp 내용 정리

Section 1에서 학습한 내용

* js/node : 조건문, 문자열, 반복문, 배열/객체, 자료형, 스코프, 클로저, spread/rest 문법 ,얕은/깊은 복사, DOM, 고차함수

* html/css : 기초 문법 , 레이아웃, selector, DOM

* linux/git : 기초 문법, workflow

* react : 기초 문법, props/state, state hook

Section 1 완강 소감

약 5주 간의 짧은 일정이였지만 적어보니 생각한 것 보단 많은 내용들을 배운 듯 하다.
학습 내용들을 쭉 나열해보니 전체적으로 다 배운 것이지만, 어떤 부분에서는 희미하게 기억만 나는 내용들도 있는 것 같다...
(복습이 부족했단 것인가...)

 

 

각 파트(카테고리?) 별로 나눠서 생각해 보면 JavaScript나 linux/git 처럼 약간 딱딱해 보이는 모습(검은 화면 or 오로지 코드)이 주를 이루는 파트는 생각보다 수월하게 진행이 가능했다.

 

알고리즘 해결 문제와 연관하여 생각해보면 간단한 수도 코드를 작성하며 어떤 방향으로 접근해야 할지(어떤 메소드를 사용) 계획을 짜고, 마치 구조 분해하듯이 하나의 문제를 각각의 문제로 쪼개서 풀어 가는 방식으로 접근을 하니 조금씩 알고리즘의 실마리가 보였다

 

이런 노하우를 체득하기 전에는 알고리즘 문제를 풀 때 마다 끙끙 싸매다가 시간을 초과하여 겨우 작성 해 제출하는 게 나의 모습이었는데, 이러한 알고리즘에 대한 실마리를 얻고 나니 제 시간 내에 알고리즘 문제를 해결하는 나의 모습을 발견할 수 있었다.

알고리즘 문제가 참 신기한 게 하나의 문제에 대한 접근 방식의 차이로 다양한 정답이 존재할 수 있다는 것 같다. (물론 효율성, 가독성이 좋은 코딩 방식이 최적의 정답이겠지만...)

 

 

사실, 진짜 노하우는 개발자 도구의 사용법에 대해 조금 이나마 깨우친 것이긴 하다
(debugger; 없었으면 알고리즘 문제는 해결도 못했을 듯...)

아직 사용법에 대해 익숙하진 않지만 디버깅하는 과정에서 코드가 어떤 방식으로 동작하면서 값이 들어오고 특정 메소드 내에서 어떤 식으로 그 값들이 변하는 지 보면서 특정 메소드에 대해 체득할 수 있었다
(특히 map 메소드 같은 고차 함수 내부에서 코드가 작동하는 방식 등)

 

 

html/css, react의 경우 내가 코드를 작성할 때 마다 그에 따라 변하는 모습을 시각화하여 볼 수 있어서 학습하는 과정에서 재미를 느낄 수 있는 부분이었다. 우리가 이용하는 대다수의 사이트들도 이를 사용해서 만들어 진 것들이 많다 보니 신기하고 재밌었다고 할까. 특히, 이 부분에 있어선 이론보다 실습 위주의 학습이라 그랬을 수 도 있겠다 싶다.

 

css의 경우 실습을 진행하면서 생각보단 많이 건드려보지 못해서 아쉬운 점이 있긴 했다. 항상 최저 한도의 문제 해결에도 급급하다 보니 꾸미는 요소(디자인)에 해당하는 css는 거의 색상, 글꼴 건드리는 수준 밖에 못 다뤘던 듯 싶다. 다음 섹션에 들어가서는 css 요소도 충분히 다루면서 학습해 봐야겠다는 생각이 든다...

 

 

html은 구조를 담당하는 부분이다 보니 사실 단독으로는 별 거 없는 것처럼? 보이지만 얘는 다른 것들과 연관시켜 생각해야 하는 녀석이였다. 특히 DOM이나 react와 연관해서 구조를 짜야 하는데 이거와 연관해 작업을 하면 생각보다 빡센 녀석이란 느낌? 그나마 DOM도 검은 화면 코딩하듯이 좀 직관적인 코딩이라서 그나마 쫒아갈 만했다.

 

결국 핵심 문제는 이 부분의 꽃인 react 였다. SPA 방식 동작, 컴포넌트화 시켜서 코딩하는 방식 등 효율적이고 좀 더 직관적으로 페이지를 작성하는 좋은 툴이라는 느낌적인 느낌을 느꼈달까.


내가 짠 코딩이 바로 바로 화면으로 출력 된다는 점이 재밌었으나...

문제는 보기보다 어려웠다는 점이다. 아직 react 기초적인 부분만 배워서 그런지 몰라도 코딩 중에 어떤 문제점(error)이 발생했을 때 이를 해결하는 과정이 아직 너무나도 어려웠다. 아직 react에서 디버깅하는 방법을 잘 이해하지 못한 나 자신이라 그런가...

 

 

props, state에 대해서는 분명히 이론적으로는 이해한 것 같은데 이 것을 실제로 적용하면 도무지 생각대로 동작하지 않는다. 사실 코딩할 때도 props를 특정 메소드나 컴포넌트에 인자로 넣어야 하는지 유무 판단도 잘 안되긴 한다.

 

state 도 내부에서 변화하는 값이므로 state hook(ex. useState)와 연관지어 생각해야 하는 부분인데 이 useState 도 이론적인 내용을 여러 번 읽어봐도 실제 적용할 때 어떤 식으로 동작하는 지 아직 자세히 모르겠다. 그러다 보니 실제로 적용할 때 끼워 맞추기 식으로 했었던 듯 싶다.


 useState 사용이 결국 다른 것들과 연관해 사용하는 것이다 보니 좀 더 복합적인 이해가 필요한 듯 싶다. 실습 과정에서 이벤트, 고차함수가 그 내용에 들어가면서 동작하는 경우가 많았다. 이 부분을 어떻게 디버깅해서 까보는지 방법을 좀 알아 내면 이해에 도움이 될 것 같은데...

 

 

총평

요약해서 내용을 정리해 보면 back-end 파트는 그나마 수월하게 따라갔다.
But, front-end 파트는 미숙했다고 자평할 수 있겠다. 특히 react 부분에 대해서는 많이 미흡하다고 느꼈다. 이 부분에 대한 복습 및 개인적인 공부를 진행해야 다음 내용을 배울 때도 따라갈 수 있을 것이다.

 

아직 섹션2, 섹션3의 더 어려운 내용 들이 많이 남았다. 하지만 전체의 1/3을 힘들지만 낙오되지 않고 따라왔다고 생각한다. 앞으로 더 어려움이 있을지라도 지금처럼 포기하지 말고 악으로 깡으로 버티자!

 

'SE Bootcamp 내용 정리' 카테고리의 다른 글

React - 보충학습 2: states, Component Life Cycle  (0) 2021.10.01
React - 보충 학습 1: 부모/자식 컴포넌트, map 메소드, props  (0) 2021.09.30
React - 기초 - 3  (0) 2021.09.17
React - 기초 - 2  (0) 2021.09.16
React – 기초  (0) 2021.09.15
'SE Bootcamp 내용 정리' 카테고리의 다른 글
  • React - 보충학습 2: states, Component Life Cycle
  • React - 보충 학습 1: 부모/자식 컴포넌트, map 메소드, props
  • React - 기초 - 3
  • React - 기초 - 2
레실이
레실이
  • 레실이
    레실이의 티스토리
    레실이
  • 전체
    오늘
    어제
    • 분류 전체보기 (91)
      • SE Bootcamp 내용 정리 (63)
      • 알고리즘 연습 (7)
      • Project 주저리 (4)
      • 기술 면접 source (3)
      • 개발 일상 (12)
      • 생성 AI 활용 (1)
  • 블로그 메뉴

    • 홈
    • 태그
    • 방명록
  • 링크

  • 공지사항

  • 인기 글

  • 태그

    node.js
    JavaScript
    Ajax
    Linux
    객체
    useRef
    useState
    react
    state
    자료구조
    IT
    CSR
    알고리즘
    CSS
    데이터베이스
    node
    Python
    ORM
    PickAndDrink
    promise
    비동기
    인증/보안
    mongoDB
    ubuntu
    MVC
    CORS
    문자열
    DOM
    fastapi
    JS
  • 최근 댓글

  • 최근 글

  • hELLO· Designed By정상우.v4.10.3
레실이
SECTION 1 회고
상단으로

티스토리툴바