TIL 39

09_[항해99 3기 2주차 항해톡 발표준비]_2021.09.27

오늘의 공부 오늘은 항해톡 발표준비로 하루를 보냈다.. 주제는 cookie, session, cache. 1주차때 본 적 있으니 어렵지 않을거라 했지만 이곳저곳 까고보니 node, php가 엮여있고.. 노트 한장을 채웠다. 아래로 저 세개의 비교를 정리해서 적는다. 서버에서 작은 데이터를 클라이언트의 브라우저에 저장하는데, 이때 이 작은 데이터가 cookie이다. 이후 같은 서버에서 사용자를 인식하기위해 쿠키를 요구하면 브라우저는 해당 쿠키를 보내준다. 쿠키는 소프트웨어가 아니기에 악성코드, 바이러스가 자체적으로 설치되진 않으나 클라이언트에게 있을지도 모르는 악성소프트웨어는 브라우저의 쿠키에 접근해 사용자의 개인적인 데이터를 가져갈 수 있다. 따라서 보안적으로 위험, 그렇기에 session 이 생겼다. ..

TIL 2021.09.28

08_[항해99 3기 2주차 React.js]_2021.09.25

오늘의 공부 react 환경에서 슬라이더를 넣고싶을때, react-slider 를 이용하면 편하다는 점을 알았다. styled-components 를 분리할때 컴포넌트별로 조각내서 분리할지 겹치는 부분만 분리할지 고민중이었는데 멘토님께 여쭤보니 멘토님은 겹치는 부분은 분리하고 나머지는 컴포넌트파일에 넣어두신다고..! ...뭔가 적어보이는데 작업하느라 시간을 꽤 날렸다. 오늘의 작업 [과제] 전체적인 스타일 작업ing, 슬라이더 추가 사실 어젠가 그젠가 피그마작업은 다 했지만 TIL에 링크를 안넣어놨길래..허헣 https://www.figma.com/file/iylbKcUH0D9dfzNxyeRhUw/SpartaReact_Dictionary?node-id=2%3A141 Figma Created with Fi..

TIL 2021.09.26

07_[항해99 3기 2주차 React.js]_2021.09.24

앞선 이틀짜리의 TIL이 없는 이유는.. 밤새서 강의를 듣고 TIL을 적기도 전에 기절했기 때문. 하지만 내겐 여태 필기한 것이 남아있다! 확실히 여태 느낀건데 필기를 하는 편이 이해하기도 좋고 나중에 뒤적거리며 찾을 때 다른 것도 같이 보니 복습하기도 좋다! 사실 TIL을 어떻게 적어야할지 아직도 온전히 알지 못해서 이런저런 형식으로 써보고있다. 어떻게 보면 난잡하지만, 한.. 50번째..정도에는 좀 보기도 좋고 내용도 깔끔하게 TIL을 적을 수 있지 않을까? 지금은 이런 일기같은 잡담을 여기 쓰고있지만 나중엔 없애거나, 접거나, 아래로 내려서 안보이게 한다던가.. 그치만 잡담은 하고싶다. 나처럼 같은 나이대의 친구들이 죄다 대학 졸프로 바빠서 친구없음상태가 된 사람들에겐 이런 혼잣말은 귀하다. 절대 ..

TIL 2021.09.25

06_[노마드코더 ReactJS로 영화 웹 서비스 만들기]_2021.09.21

오늘의 공부 ajax, fetch, axios 이 친구들의 관계성에대해 헷갈리기 시작한 나는 파고파다가 api까지 다시 공부했다. 이 글에서는 ajax가 기술이고 그걸 쓰는게 fetch라고 하고 저 글에서는 ajax도 방법이고 fetch도 방법이고 axios도 방법이고.. 뭔소리야!!! 그리고 구원과도 같은 멘토님의 한마디 jQuery에서 ajax 는 jQuery 내에서 AJAX를 구현하는 메소드를 부르는 이름이니 AJAX(개념)과 ajax(기술)을 구분하여 생각해주시면 됩니다. 모든게 납득되는 시간이다. 그러니까 이놈의 대문자소문자 구분때문에 내가 그 몇시간을.. 이놈의 코딩은 그놈의 대소문자구분을 왜이리좋아하는건지! 이 부분에 대해서는 미래에 또 까먹을 나와 미래의 뉴비를 위해 따로 글을 팠다.. 오..

TIL 2021.09.21

05_[노마드코더 ReactJS로 영화 웹 서비스 만들기]_21.09.20

큰일이다..너무 졸리다..잠들기전에 TIL 한줄이라도 써야만. 오늘의 공부 오늘도 노마드 코더의 리액트 강의를 보고있다. 보면서 fetch, axios 에 대한게 이해가 안가 찾아보았지만 여전히 애매하다. https://www.npmjs.com/package/axios axios Promise based HTTP client for the browser and node.js www.npmjs.com 여기에 axios 에 대해 적혀있지만..번역기로 돌려도 좀 아리까리하다. 뭐, 이런 부분이야 적당히 그러려니하고 넘어가서 더 익히다보면 어느순간 이해될테지만. 적당히 생각하자면 fetch보다 한단계 위(?) 가 axios이고 fetch({}); 이런식으로 쓰는것.. 쭉 찾아보니 확실히 직관적이고 코드도 짧아 ..

TIL 2021.09.20

04_[노마드코더 ReactJS로 영화 웹 서비스 만들기]_21.09.19

아까 WIL을 적긴 했지만 그거랑 별개로 TIL을 적어야겠지... 오늘의 공부 노마드 코더의 리액트 초보자 강의를 들으며 다음주부터 배울 리액트를 대비한 빌드업 시작. 강의 길이가 짧지만 지식들을 한방에 때려넣다보니 금방 지친다..! 아직 2.1까지밖에 듣지 못했다. 처음부터 난관이었던게, 나의 기본 지식으로는 html 파일을 불러올때 js가 길면 로딩이 오래걸린다고 생각했기에 "리액트는 자바스크립트에 html 내용을 넣어요" 라는 말이 이해가질 않았다. 내 지식상으로는 분명 비효율적인데, 리액트가 이렇게 한다는건 그게 효율적이라는 의미잖아? 검색해보고, 질문해보고 알게된것 간단하게 생각하자면 버츄얼돔을 이용해서 속도가 증~말 빠르다는것!! 그러니까 요즘 회사들은 다 이걸 쓴다고.. 공부하면서 필기를 두..

TIL 2021.09.19

03_[항해99 3기 1주차 팀프로젝트]_21.09.17_프로젝트_정리

오늘 작업한것, 공부한것 좀 더 동적으로 보일 수 있도록 css animation 과 자바스크립트 기능으로 애니메이션 추가 도메인으로 사이트에 접속했을때 복사기능이 먹지 않는걸 발견 사이트가 .writeText 를 undifined 라고 알려주는데 이게 사용자마다 있는 보호벽(?)때문. 해결방법은 https를 붙이면 되나 인증서도 받아넣기엔 마감시간이 촉박해서 복사 기능 자체를 삭제했다.. 기타 오류 개선 사이트에서 동작하는 기능들 영상으로 찍어서 유튜브에 올린 뒤 제출. 다른 사람들과 함께 하나의 주제로 사이트를 만드는 프로젝트는 이번이 처음이다. 나의 첫 프로젝트를 잊지 않기 위해 프로젝트 내용에 대해 기입한다.. ㅠ 누구나 게임할때 닉네임을 짓기 힘들었을터다. 나만해도 정말 20분~30분은 닉네임 ..

TIL 2021.09.18

02_[항해99 3기 1주차 팀프로젝트]_21.09.16

오늘 작업한것, 공부한것 옵션 선택 페이지 html 과 결과 보여주는 페이지 html 병합완료 에러사항 개선 css animation 일부 추가 코드 정리 : 정말 티도 안난다. load()를 통해 입력된 사용자의 아이디를 가져와 다른 html파일에서 사용하려했으나 장렬히 실패. $.cookie('이름', '내용물'); 을 통해 사용자의 쿠키로 저장 (브라우저 끄기 전까지 존재) $.cookie('이름'); 을 통해 내용물을 가져온다. 그런데 검색해보니 보안상 세션을 쓰는게 낫다는 말을 보았다.. 오늘 백엔드를 맡으신 팀원분들이 기능 작업을 완료했다! 조금만 더 손 보면 내일 딱 끝낼듯..

TIL 2021.09.17

01_[항해99 3기 1주차 팀프로젝트]_21.09.15

이걸 올리는 시간은 이미 새벽을 지나서 16일이 되어버렸지만.. 15일이라고 치고. 현재 부트캠프 항해99 3기를 달리다가 TIL을 쓰고자 마음먹었다. 부트캠프 1주차 팀프로젝트 중이며 프론트엔드 파트를 맡아서 작업하고있다. 우리는 총 4명의 팀이며 모두 웹개발 초보자에 가깝다. 두명은 프론트엔드를 맡고 두명은 백엔드를 맡기로 했으나 이후 필요하다면 유동성있게 파트를 이동하기로 했다. 어제..가 아니라 엇그제까지.. 앞선 2일간 작업한것 프로젝트 구성 회의(?) 내용 : 랜덤하게 닉네임을 만들어주는 사이트 기능 : 로그인,회원가입 시스템, 사용자가 선택한 옵션에 맞는 랜덤한 단어를 조합하여 결과물 보여주기, 닉네임 저장하기 와이어프레임 짜기 및 전체적인 웹디자인 로그인, 회원가입, 랜덤 단어 옵션 선택 ..

TIL 2021.09.16