본문 바로가기

분류 전체보기

(388)
<주간회고> 부스트캠프 챌린지 4주차 ( + 수료) 1. 들어가며 드디어 4주간의 부스트캠프 챌린지과정이 끝이났다. 사실 마지막 회고를 따로 써야하나 고민했는데, 그냥 여기에 한번에 쓰기로 결정했다. 대신 소제목은 조금 바꿨다. (이번주는 => 지금까지, 다음주는 => 앞으로는) 4주가 어떻게 흘러갔는지도 모를만큼 순식간에 흘러갔다. 정말 너무 바빠서 카톡은 새벽에 몰아서 보기도 했고, 밖에 나간 기억은 정말 드물다. 매일 꾸준히 했던 뉴스스크랩, 알고리즘 문제풀이는 한번도 하지 못했고, 네이버블로그에 매일 쓰던 일기는 주간일기로 바꿨다. 이렇게 바빴던 만큼 얻을 수 있었던 것도 많았다. 이번 회고는 그렇게 얻은 것들을 써보고 싶다. 그래서 이 글을 쓰기전에 지금까지의 주간회고를 읽어봤고, 이렇게 또 회고를 쓰고 있다. 2. 지금까지 1주차는 혼돈의 연속..
<주간회고> 부스트캠프 챌린지 3주차 1. 들어가며... 정말 갈수록 시간이 빨리 가는 것 같다. 그래도 이제는 이 생활이 익숙해졌다. 익숙해짐과 동시에 내가 정말 많이 성장했음을 느꼈다. 분명 난이도가 어려워졌으면 어려워졌지 쉽지는 않았는데도 1시에는 침대에 누울 수 있었다. (목요일제외...) 이전보다 부담도 많이 덜었고, 걱정보다 기대가 많아졌다. 2. 이번 주는... 이번 주도 너무 좋은 팀원들을 만났다. 이번 주에는 지금까지와는 다른 방식으로 피어세션을 했다. 지난주까지는 코드에 집중했다면 이번엔 이론과 코드 반반 느낌? 처음에는 코드를 더 개선하고 싶다는 생각도 했지만 둘쨋날부터 생각이 바뀌었다. 코드도 충분히 서로 리뷰할 수 있었고, 서로 얘기 나누고 싶은 내용까지 깊이있게 토론했다. 정말 내가 이런 분들이랑 이런 얘기를 하고있..
<ES7> ES2016(ES7) Features 1. 소개 ES7은 2016년에 발표된 ECMAScript2016 을 의미한다. 정식명칭은 ES7이 아닌 ES2016이다. 저번 포스팅해서 언급했듯이 TC39는 2015년부터 매년 새로운 버전의 ECMAScript를 릴리즈하기로 했었다. ES2015에 수많은 기능이 추가된지 1년밖에 안되서 그런 것인지는 모르겠지만 ES2016에서는 2개의 기능만 명세에 추가되었다. 하지만 나중에 등재되는 Async Await의 키워드나, Object values, etries등의 키워드가 등장하였다. 그리고 padStart, padEnd로 익히 사용되는 기능이 ES2016에서 padLeft, padRight라는 키워드로 등장하였다. 이들은 모두 ES2017에서 명세에 추가된다. 2. 기능 * Exponentiation ..
<주간회고> 부스트캠프 챌린지 2주차 1. 들어가며... 지난 주에 회고를 너무 길게 썼다. 그래서 후회중이다. 사실 매일 다른 미션을 해결하지만 큰 틀은 변하지 않고 있어서 크게 쓸 말이 없다. 바뀐게 있다면 내 자신이 매일매일 발전하고 있다는 점? 정도가 아닐까. 그리고 여전히 매일매일이 도전이고 힘들지만 조금은 이 생활이 익숙해지고 있다는 점?이 있다. 2. 이번 주는... 이번 주의 미션은 월요일 화요일은 매우 어려웠고, 수요일 목요일은 어느 정도 할만했다. 특히 월요일은 새벽3시까지했음에도 결국 완벽하게 해내지 못했다. 2주차부터 막히는구나라는 생각이 들면서 너무 속상했었다. 다행히 팀원들 절반이상이 나와 같은 결과여서 이번 과제가 많이 어려웠다는 것을 알게 되었다. 화요일의 미션도 정말 어려웠지만 평소에 공부해보고 싶었던 내용이었..
<ES6> ES2015(ES6) Features (2) 1. 소개 - 지난 포스팅에서 ES2015의 등장에 대해서 간단히 짚었다. ES2015(ES6)은 ES5가 소개된 후, 무려 6년이나 지나서 나타난 만큼 무수히 많은 기능들이 추가되었다. - 지난 번에 알아본 기능들을 나열해보면 Arrow Function, let, const, Default Parameters, Template Literals, Object Initialize, Destructuring Assignment 이 있다. 2. 기능 이번 포스팅을 끝으로 ES2015의 소개를 마칠 것이므로 모든 기능을 소개할 수는 없을 것 같다. 대표적인 나머지 기능들을 알아보고, 그 외에는 기타로 빼두었다. * Class - 대부분의 객체지향언어(C, Javs, Python)등과 달리 자바스크립트는 Clas..
<ES6> ES2015(ES6) Features (1) 1. 소개 이번 글을 시작으로 ECMA Script의 변화들을 정리해볼 예정이다. 먼저 ES6로 흔히 알려진 ES2015의 변화들과 그 기능들로 시작해보려한다. ES6은 위와 같은 짤이 있을정도로 자바스크립트에 엄청난 진화를 이루어냈다. 이 때를 시작으로 JQuery의 몰락이 시작되기도 했다. JQuery가 2006년 소개된 이후로 프론트 생태계에 엄청난 영향을 끼친 것은 사실이나, JS를 완전히 대체할 수 없었던 점, 노드JS의 등장과 리액트와 뷰와 같은 Virtural DOM의 사용등은 ES5를 사용한 Jquery를 누르기에 충분했다. 필자는 Jquery를 사용해본 적이 없으므로 이 내용은 일단 넘어가자... ES6은 이미 모든 브라우저(IE는 브라우저가 아니다. 응가다.)에서 지원할 정도로 표준화되..
<주간회고> 부스트캠프 챌린지 1주차 1. 들어가며... 7월 13일 정말 운이 좋게도 네이버 부스트 캠프에 합격했다. 그 때는 정말 마냥 좋았고, 열심히 해야겠다 다짐했었다. 7월19일 부터 1일차가 시작 되었고, 나의 '열심히'는 열심히 축에 끼지도 못한다는 것을 깨달았다. 나름 조금은 개발을 할 수 있다고 생각했었는데, 오만했었던 것 같다. 세상에는 정말 대단한 사람들이 많았고, 나는 너무나도 작았다. 정말 매일매일이 도전이었고, 첫 날을 제외하고 2시 전에 잔 적이 없다. 하루하루 많이 배웠고 정신없이 흘러갔다. 공부내용은 따로 정리하고 있지만 나의 생각과 마음가짐은 따로 정리하지 않기 때문에 이렇게 회고를 써보려 한다. 워낙 외부에 공개할 수 있는 정보가 한정적이기 때문에 위처럼 이미 공개되어 있는 것을 바탕으로 회고를 작성할 예정..
<파이어베이스> 배포 및 보안 1. 배포 * 준비 - cra를 깃허브를 통해 배포하기위해 패키지를 하나 설치해야한다. 아래의 명령어로 설치하자. npm i gh-pages - 설치가 완료되면 package.json 파일을 수정해야한다. 먼저 패키지를 설치했을 때 안내문구가 떴을 것이다. 이를 따라 "homepage" 를 추가해주자. "homepage": "https://haesoo9410.github.io/testtest" - 위 처럼 작성한다. 가장 끝에는 연결된 레포지토리를 작성한다. 연결된 레포지토리 확인은 git remote -v 를 입력하여 확인할 수 있다. 만일 연결된 레포지토리가 없다면 remote명령어로 연결시켜야한다. * 배포 - 배포를 위한 스크립트를 작성하자. 아래의 두 명령어를 package.json의 스크립트에..
<파이어베이스> 프로필 수정 1. 프로필 수정 * 프로필 가져오기 - 사용자의 닉네임 또는 사용자명을 보여주고 싶다고 가정하자. - 우리는 현재 user객체를 userObj라는 객체로 사용하고 있다. (firebase.auth().currentUser) - 이 객체에는 여러가지 프로필 정보와 관련된 속성이 있다. 대표적으로 displayName과 email, photoURL이 있다. 필자는 구글로 로그인 했기 때문에 구글에서 사용하는 사용자명이 그대로 displayName에 담겨 있었다. {userObj.displayName}의 프로필 - 위와 같이 유저 객체를 이용하여 displayName 을 불러왔다. 하지만 userObj가 없다거나 displayName이 없을 경우 오류가 날 수 있으므로 아래와 같이 수정하였다. {userOb..
<파이어베이스> 필터와 정렬 1. 필터 - 우리는 프로필페이지를 별도로 만들어서 로그아웃 기능을 버튼과함께 넣었었다. 이번엔 프로필 페이지에서 로그인한 사용자의 글만 보이도록 필터링해보자. * 쿼리 - 파이어베이스의 Cloud Firestore은 컬렉션이나 그룹에서 검색할 문서를 지정하는 쿼리 기능을 제공한다. // Create a reference to the cities collection var citiesRef = db.collection("cities"); // Create a query against the collection. var query = citiesRef.where("state", "==", "CA"); - 위는 파이어베이스 공식문서에 나온 예시이다. 위 코드는 db에서 cities 컬렉션으로 Ref를 만들고..