[Front-end web developer]

코드스테이츠 FE Section3 회고

mellomello.made 2022. 8. 19. 21:00

Section3를 진행하면서 느꼈던점

 

자료구조 알고리즘 재귀부터 시작했던 섹션3. 

재귀 파트하면 까도까도 나오는 마트료시카가 기억에 남는다. (실시간 세션에서 코스 크루 아윤님이 귀여운 그림으로 풀이해주셨는데 귀여운 그림 덕분인지 지루하지 않았다.)

페어와 코플릿 15문제를 풀면서 재귀 마스터가 되는 줄 알았지만~ 알고리즘은 너무 어렵다..

재귀는 JSON 구조가 재귀 함수를 사용할 수 있는 트리 구조를 해결하기 위해 배우는 기초였고 JSON.stringify 와 JSON.parse 를 사용하여 자바스크립트 값과 JSON을 넘나드는 스프린트 시간을 가졌다.

 

마트료시카에 절여진 탓에 다음 유닛인 [사용자 친화 웹] UI/UX에서 피그마 시간이 너무 재밌었다. 유일한 엔터테이너 시간 같았달까.

포토샵과 일러스트를 다룰줄 아는 나에게 처음에 피그마는 좀 답답했다. 포토샵으로는 이 툴로 하면 바로 될텐데 이건 뭘 건드려야 하는거야.. 하지만 피그마의 기능을 알고나니 피그마.js 이런 프로그램 나왔으면 좋겠다는 생각이 들었다. 

역으로 구현한 것을 코드로 짜주는 프로그램. 그럼 나중에 FE가 할일이 없겠지..?

피그마 와이어 프레임, 프로토타입을 만들면서 약간의 유우머를 가미한 인스타 인플루언서 계정도 만들어보고,

페어님이랑 우리 쓸데없이 고퀄이라고 깔깔 웃었던 시간. 희희

그리고 스타일드 컴포넌트를 배웠는데 코드 블럭 대로 따라 치는데도 왜 오류가 날까.. 싶던 차에 눈에 잘 안 보였던 저 참깨같은 백틱이 보였다.. 

const BlueButton = styled.button`
  background-color: blue;
  color: white;
`;

눈을 크게 뜹시다.

요즘 눈이 너무 침침하다..

UI를 한눈에 보고 개발하는 CDD 도구 스토리북도 만져봤다. 스토리북도 리액트 컴포넌트의 장점 재사용성이라는 특징을 갖고 있다. 아직 경험이 많지 않다보니까 어디가 편리해서 사용하는건지 감이 안왔다.

 

그리고 다음으로는 리덕스 시간!

페어님을 잘 만난 덕분에 스프린트 과제는 금방 끝냈고 페어님과 뽀모도로 사이트 클론 코딩 미니 프로젝트를 했다. 프롭스 드릴링은 뭐가 추상적이게 느껴졌는데 프롭스를 쓰다보니 대체 어디까지 뚫을 셈이야... 바로 알것 같았다...!

클론 프로젝트에 리덕스를 적용하려고 했는데 막상 짧은 시간에 하려니 기본 기능 구현만 겨우 끝냈다. 시간이 조금 더 있었으면 막판에 지치지 않았을텐데 조금 아쉬웠다. 저와 함께해주신 리액트 장인 천재 재형님 짱. 

피그마로 구현
 

Figma

Created with Figma

www.figma.com

요즘 나는 박뽀모도로 일 정도로 토마토를 사랑하게 됐는데 뽀모도로 타이머 켜두고 25분 동안 집중하다가 타이머 끝나면 뭔가 해낸 느낌이 든다. ㅋㅋㅋㅋㅋ

 

클론한 뽀모도로 사이트
 

Pomofocus

An online Pomodoro Timer to boost your productivity --> Pomofocus is a customizable pomodoro timer that works on desktop & mobile browser. The aim of this app is to help you focus on any task you are working on, such as study, writing, or coding. This app

pomofocus.io

실제 사이트는 스타트 누르면 딸각 사운드가 나는데 그 사운드도 꽤 좋아서 계속 누르게 되는 묘한 중독성이있다.

학습하는데 집중력이 흐려진다면 토마토의 힘을 빌려보세요.

 

웹표준과 네트워크 심화는 이론이어서 쉬어가는 타임이라고 생각했지만 기술면접 질문감으로 아주 딱이었다.

눈에 불을 키고 블로깅 좍좍.

다음으로 백엔드 찍먹 인증/보안을 배웠다.

내가 만든 꾸끠~ 이때는 뉴진스 쿠키 노래가 나오기 전이지만 지금은 쿠키에 중독됨 

해싱, 쿠키, 세션, 오어스, 토큰 조금 찍먹해봤던.. ㅎㅎ

소셜 로그인 할 때 카카오는 kauth 라고 뜨는 것을 발견했는데 왜 kauth인지 알것 같았다.

안드로이드 버전 이름들을 보면 

  • 안드로이드 1.0 애플파이
  • 안드로이드 1.1 쁘띠 푸르
  • 안드로이드 1.5 컵케이크
  • 안드로이드 1.6 도넛
  • 안드로이드 2.0 / 2.1 에클레어
  • 안드로이드 2.2 프로요
  • 안드로이드 2.3 진저브레드

이런 식인데 쿠키도 쿠키 좋아하는 개발자가 붙여서 귀여운게 아닐까 싶다.

미니 해커톤 시간에는 이전에 만들어 놓은 뽀모도로 디벨롭 하려고 했는데 피그마 하다 보니 하루가 다 갔다..

뽀모도로 업데이트 해줘야하는데 학습 + 복습만 해도 빠듯해서 내 토마토 관리 못해주는 중.. 

그래도 프로젝트를 해보니까 리액트 구동 메커니즘의 감이 잡혔다.

 

 

  1. 목표 상기하기
  2. Keep, Problem 작성하기
  3. Try 작성하기
  4. 우선순위 정하기

 

목표 상기하기

취업을 위한 목표로 일단 학습에 매진한다.

 

Keep

오전 7시 기상하고 자리 앉아서 구글밋 키기(기상신고)

알고리즘 스터디 하면서 매주 프로그래머스 2문제 풀고 이론 한과목 정리.

정규시간 끝나고 한시간 산책하거나 헬스.

긍정확언 나누기.

 

Problem

기상신고를 하는데 작심삼일이다. 주말만 지나고 오면 왜이렇게 기강이 해이해져있는지..작심삼일 10번 한듯.

스프린트 복습이 부실하다. 하루 종일 페어 하면 진빠져서 저녁에 아무것도 못하는 나를 발견..

데일리 코딩 이렇게 풀어도 되는건가.. 어려워서 레퍼런스 복붙하는데 일단 수도코드를 자세히 작성하려고 노력한다. 

 

Try 

모던 자바스크립트 딥다이브 스터디를 개설해서 책 완독 + 깃 커밋을 시작했다.

혼자 읽으려니 집중안되고 눈에 안들어왔는데 타이핑하면서 읽으니까 집중이 잘되고 

알고있다고 생각했던 지식들이 사실은 모르고 있었던 것도 많았다 ㅠㅠ 안다고 대충 넘어갔는데 책 읽으면서 새롭게 알게됐다.

프로젝트 전까지 최대한 읽고 부족한 자스 지식 채우기로..

 

우선순위 정하기

정규 수업 끝나고 복습 꼭 하기.

딥다이브 깃 블로깅

알고리즘 문제 최대한 혼자 생각하는 연습 기르기

운동은 주 2회

 

 

 

 

 

'[Front-end web developer]' 카테고리의 다른 글

코드스테이츠 FE Section4 회고  (0) 2022.08.20
코드스테이츠 FE Section2 회고  (0) 2022.06.22