에고 밀려서 쓰는.. WIL! ㅎㅎ

[주특기 입문] 주차였는데 뭔가 매니저님들이나 다른 분들이 엄~청 겁줘서 걱정반 기대반으로 시작했지만~ 

생각보다 별거 없었당

기존에 했던대로 팀과제 조금씩 하고 나머진 본인 공부시간! 

물론 개인과제인 버킷리스트 만들기가 있었는데, 코딩애플 코딩애플 (Coding apple) 선생님 강의를 미리 수강해놔서 수월하게 해결했다. 역시 이러니 저러니해도 공부는 본인이 하는거다. 같은 공부시간을 가지고 비슷한 조건으로 공부했지만 얻어가는건 저마다 차이가 있었고, 나도 다른거 제쳐두고 내 공부에 집중했던거 같다.

 

어렴풋이 눈치는 챘는데 이번주차에 확실히 느꼈던게 항해99에는 여타 함정이 존재한다..

우선, 시스템.  스파르타에서도 1~7기에 거쳐 여러가지 시도해보고 걔중에 더 많이 끌고 갈 수 있는 시스템을 선택했다고 생각한다. 당연히 그게 옳다.

하지만, 사람이 많으니 당연히 모두에게 맞춤이 될 수는 없다. 팀과제/ CS스터디/ 개인과제/ 개인학습자료/ 지급된 강의들/항해톡/종종 열리는 세션강의/매니저님의 순회 등등 일정이 적지 않은데, 항해의 시스템에 너무 많은 비중을 두고간다면  제 공부할 시간이 압도적으로 적어질거다. 모든것을 따라가기보다는 내게 도움이 되는 것을 취할 필요가 있다고 생각한다.

 

두번째, 강의. 첫번째 느낌과 비슷한데 사람마다 맞는 강사는 있다고 생각한다. '나도 누군가에겐 OOO 일 수도 있다'는 명언처럼.. 우선 지급되어 버린 강의에 눈을 뺏겨 다른 강의를 찾아볼 생각을 하지 못한다면 불필요한 시간이 더 들 수도 있다고 생각된다.

 

세번째, 우리 커여운 동기들. 사실 3가지 다 내용은 일관된다. 모두의 실력이 제각각이고 실력 증가의 폭도 제각각이다. 

남들의 화려한(?) 실력에 마음이 급해져 황새를 좇아간다면 그거야말로 시간이 뭉텅이로 날라간다고 생각한다.

 

뭐 이런거 다~ 감안하고도 항해99는 압도적으로 좋은 시스템이라고 생각한다. 우선 개인이 하기힘든(거의 할 수 없는..)

몰입을 99일이나 할 수 있다는점 하나만으로도 지인 10명이 물어보면 10명에게 추천할 수 있다.

몰입 뿐 아니라 함정이라고 쓰긴했지만 항해의 시스템은 굉장히 잘 굴러가있다. 내게 필요한 것을 취해서 항해 기간을 보낸다면 어느샌가 큰 보상으로 돌아올거라고 확신한다.

그리고 아직 경험해보진 못했지만 실전프로젝트, 3주차까지 지나고나니 더욱 엄청난 경험이 될 것이라는 생각이든다.

실제로 현업에서 하시던분들이 극찬하는 프로젝트니 더 말해 뭐하겠어..

 

뭐 적다보니 딱히 회고는 아닌거 같은데.. 모르겠고ㅎㅎ WIL 키워드 준거 적고 마치겠음!

State, Props, 리렌더링 발생 조건

대표적인 3가지 리렌더링 조건

  1. Props 변경 (=> properties의 줄임말)
  2. State 변경
  3. 부모 컴포넌트 렌더링

1. Props 변경

Props 업데이트가 일어나면 리렌더링을 한다.

Props가 변경되는 건 부모 컴포넌트의 State도 변경이 일어난다는 의미이다.

 

부모 컴포넌트의 State 변경이 발생하면 Props도 업데이트되고,

모든 하위 컴포넌트에 대해 리렌더링이 발생한다.

 

2. State 변경

State 업데이트가 일어나면 리렌더링을 한다.

 

리액트에서 State 값이 변경되면 관련 컴포넌트들을 전부 리렌더링 한다.

리액트는 변화를 바로바로 감지하여 화면에 변경사항을 보여주기 때문이다.

 

3. 부모 컴포넌트 렌더링

부모 컴포넌트가 렌더링을 하면 그 자식 컴포넌트들은 모두 리렌더링 한다.

Props와 같은 원리이다.

 

 

결론

리렌더링 조건을 생각하며 로직을 최적화하자.

 

출처: https://tooo1.tistory.com/580 [개발자 퉁이리:티스토리]

이번 알고리즘 주차도 무사히 끝났습니다~ 쨕쨕👏

휴 시간이 호로록 지나가서 아무것도 안한거 같은데 TIL 써놓은거 살~짝 보니까 생각보다 이것저것 많이 했더라구요:)

 

요번주는 주특기 언어인 자바스크립트 알고리즘 문제를 열~심히 풀었습니당. 나는 재밌게 한주 보낸거 같은데 여기저기서 지루해선지? 곡소리가 울려퍼지고 어떤 회의감? 에 빠진 분도 몇몇 보였다. 뭐 나중엔 정신차리고 하는거 같긴 하더만.

한 30문제를 찬찬히 리뷰하면서 한주를 보내니까 로직에 대한 이해라든지 자주 쓰는 반복문이나 삼항 연산자 같은 코딩이 많이 익숙해진게 큰 힘이됐다.

특히 나중에는 짰던 코드에 오류가 발생하면 해결하는 능력치가 많이 올라갔다.

그리고 문제를 풀면서 매일 팀원들끼리 자기가 푼 문제 설명하고 리뷰하는 시간을 가지면서 내 생각을 언어로 표현하는 능력이 많이 향샹된걸 느꼈다. 이래서 뭐든 해보는게 중요하다니깐, 항해99는 사람에게 중요한 능력치가 뭔지 제대로 파악하고 있고 해당 능력치를 올릴 방법또한 상당히 잘 파악하고 있는게 틀림없다.

 

아 생각보다 복병이었던게 이번주부터 CS스터디를 시작했는데 첫날 발표가 당첨돼서 준비하는데만 6시간은 쓴거같다.... 에잉 뭐 이거 관련해선 나중에 목차를 따로 만들어서 이야기를 풀어야할거 같으니 이만 줄이고, 오늘 WIL 은 또 숙제를 줘서.. 휴 JavaScript의 ES란?, ES5/ES6 문법 차이 를 적어야겠다.... 이거 작성하는 오늘이 일요일이라 빈둥거리다가 WIL 숙제 생각나서 부랴부랴 쓰러왔다ㅠ 

 

자바스크립트 ES란!?

자바스크립트 표준 규격이다. 뭐 옛날에 브라우저 전쟁했다가 당시 절대자가 표준규격으로 정한게 ES라던데 그때야 전쟁이지 지금 내가 알게뭐냐~ JS 잘쓰고 있습니다 감사합니다~

 

ES5/ES6 문법 차이

게임에서 패치를 통해 버전 업그레이드 하듯이 언어들도 업그레이드 과정을 거친다. 예상대로 당연히 6은 5의 업그레이드  버전이다. 간단하게 해당 버전의 특징만 보자,

ES5 (2009)

  1. 배열에 forEach, map, filter, reduce, some, every와 같은 메소드들이 지원되었다.
  2. Object에 대한 getter와 setter가 지원되었다.
  3. Javascript strict모드가 지원되었다. (기존에 비해서 더 엄격하게 문법 검사를 진행한다.)
  4. json 형식의 자료들을 지원한다. 과거에는 XML이라는 규격을 사용했다가, json이 인기를 끌면서 javascript 역시 지원을 하게 되었다.

ES6 (2015)

  1. Hoisting을 개선했다.
    기존에는 var키워드를 사용하여 호이스팅이 빈번하게 일어났는데 이를 방지하기 위해 블록 스코프를 가진 let과 const를 추가했다.
  2. 화살표 문법을 지원한다.
    장점 : 코드의 간결화, this를 바인딩하지 않는다.
  3. iterator와 generator 추가.
  4. module의 import/export 추가.
  5. Promise 도입
    자바스크립트는 비동기적 언어이기 때문에 callback에 대한 이슈가 많았으나 이부분을 해결할 수 있는 문법을 제공한다.

끝~! 다음주엔 WIL 좀 길게 쓰고싶다 자꾸 숙제만 하는느낌이넹

 

출처 :https://velog.io/@janghoon333/study-ES 감사합니당

 

 

 

 

항해 99 출항

항해 첫 주가 끝났다.

스파르타.. 일정은 이름에 걸맞게 진행되었고, 항해원들은 비바람을 맞으며 허우적거렸다...

 

하지만 허우적거림도 잠시, 인정하기 싫었지만 사람은 맞으면서 배울때가 효율이 가장 좋았고

우리들은 얼굴에 붙은 머리카락과 낙엽을 때며 현실을 파악했다ㅠ

 

처음 보는 사람들, 기본9 to 9 의 일정(11시가 기본이더라), 등등 속에서 시작된 프로젝트.

불행인지 다행인지 우리팀은 조타실에 내가 들어갔고 부담스러웠지만 든든한 팀원들 덕에 첫 프로젝트는 잘 마무리됐다.

 

프로젝트에 대한 막연한 불안감을 갖고 있었는데 이번 프로젝트를 잘 끝마치며 말끔히 치유되었고, 앞으로 개발자로서의 방향성이 조금 더 잡힌 것 같다. 특히 커뮤니케이션의 중요성을 너~무 깨닫게 되었다. 물론 사람과의 커뮤니케이션도 너무 중요하지만 Git 이라는 개발자들의 기본 커뮤티케이션의 중요성을 알게되었다..

 

진행하다보니 웹개발을 1~2달이라도 더 해본 내가 업무를 조금씩 더 맡았었는데, JWT 방식 로그인 회원가입 진행하고나니 팀원이 맡은 유틸페이지가 전혀 구현이 되지 않아서 전에 조금이라도 해본 본인이 유틸페이지 등등까지 맡게되었다.

나도 뭐 구현까지 해본건 아니어서 JWT나 유틸페이지나 고민도 많이하고 적용하는 과정에서 코드도 많이 작성하고 공부도 많이 하게된것 같다. 프로젝트 기간에는 업무가 좀 부담스럽나 싶었지만 끝나고 나니 얻어가는게 정말 많았다.


뭐 이것저것 일기처럼 쓸 생각이었는데 WIL 키워드를 정해줘서 JWT에 대해 설명을 잠깐 해야겠다.

 

    1. JWT

 

JWT 뭔 소리여~ 아직도 정확하게 이해한건 아닌데, 그냥 내가 코드 짠것도 있고 하니 내가 느낀 특성을 말해보면,

id pw 입력하고 들어온 사용자에게 너 제대로 id pw 입력하고왔으니까 해당 웹페이지를 사용할 수 있는 자유이용권을 준다~ 정도다. 로그아웃 할때는 자유이용권 뺏어버리면됨!

(재미없는 내용이라 이정도만 하고 넘어가고 싶지만) 조금만 더 자세히 설명해보자면,

 

1) 로그인시에 사용자의 id와 pw를 암호화해 토큰화시킨다(JWT 메서드로 암호화함). Token->브라우저에선 쿠키라고 부른다.  ($Cookie. 라는 jQuery 문법도 따로있을 정도로 많이 쓰는 개념)

 

2) db에 저장된 id와 pw를 입력하고 접속한 사용자에게 토큰을 전달해주고

(이때 토큰을 Header로 바로 전달주는 방식과 -> 브라우저에 쿠키값을 꽃음

Body로 넘겨주는 방식이있음 -> response로 프론트쪽으로 넘겨주는 방법)

 

3) 로그아웃시엔 토큰만 빼았으면 된다.

 

물론 회원가입시에 pw 또한 그냥 db에 저장하면 안되고 해쉬함수를 통해 pw를 암호화해 저장한다.

기본적으로 pw와 Token 값이 암호화되어 있어 db에 저장된값을 쓰기가 어려워 Jinja를 사용하는게 수월하당

 

끝~!  

매일 TIL 남기고 있으니께 여기다가도 링크 남겨놔야지 뭐 프로젝트때 TIL은 아니구 프로젝트 끝난 금요일부터 알고리즘 하고 있는데 그때 TIL임!

https://translucent-bit-b63.notion.site/2-e144c49e78b24cb5b1d12aad7695e664

 

다들 낙오하지 말자구~

 

+ Recent posts