본문 바로가기

분류 전체보기

(22)
지난 두 달간의 회고, 인턴과 앱 출시 미루고 미뤘던 블로그를 시작한지 벌써 거의 세 달이 되어간다. 그동안 숙원이였던 블로그를 시작했던 만큼 지금까지 쓰고 싶었던 글과, 공부하면서 적고 싶은 주제들을 꾸준히 올렸지만 7월부터 인턴과 함께 NEXTERS라는 동아리를 같이 시작하는 바람에 약 한달 이상 블로그에 글을 적지 못했다. 이제 회사 생활과 업무도 어느정도 적응이 되었고, 동아리를 통해 두 달 동안 주말 없이 개발했던 서비스도 런칭을 하면서 조금 여유가 생겼기 때문에 다시 한 번 블로그에 꾸준히 글을 올리려고 한다. 그리고 그 시작을 정말 바빴던 지난 두 달간의 회고로 작성한다. 먼저, 1년 전 계획에 없던 휴학 필자는 복수전공이라는 핑계로 군대를 1년 늦게 갔기 때문에 군복무 후 복학했을 때는 이미 3학년이였다. 심지어 주전공이 잘 맞..
[Javascript] var, let, const의 차이점 Javascript에서 변수는 var, let, const 세 가지 키워드를 통해 선언할 수 있다. 지금부터 var, let, const 세 가지 키워드의 차이점을 알아보자. var var는 ES6 이전에 주로 사용되던 변수 선언 키워드로서 Function Scope로 동작한다는 특징을 가지고 있다. 먼저 Function Scope가 무엇인지 다음 두 코드를 비교해보자. // Code 1 var name = "Yorr"; function setName() { var name = "John"; console.log(`My name is ${name}`); } setName(); // My name is John console.log(`My name is ${name}`); // My name is Yorr..
[프로그래머스] 쇠막대기 (Level 2, Python) 온라인에서 코딩테스트 문제를 풀 수 있는 프로그래머스의 Level2 쇠막대기 문제. (https://programmers.co.kr/learn/courses/30/lessons/42585) 문제 설명 해당 문제는 끝 점이 겹치지 않는 쇠막대기를 아래에서 위로 겹친 후 레이저를 위에서 수직으로 발사하여 쇠막대기를 자르는 문제이다. 반환 값(answer)은 잘린 쇠막대기의 총 개수이다. 문제의 조건은 다음과 같다. 쇠막대기는 자신보다 긴 쇠막대기 위에만 놓일 수 있다. 쇠막대기를 다른 쇠막대기 위에 놓는 경우 완전히 포함되도록 놓되, 끝점은 겹치지 않도록 놓는다. 각 쇠막대기를 자르는 레이저는 적어도 하나 존재한다. 레이저는 어떤 쇠막대기의 양 끝점과도 겹치지 않는다. 다음은 입력(input)에 대한 설명이..
[ES6] computed property name 최근 Vuex를 공부하다 Mutation 부분에서 다음과 같은 코드를 보게 되었다. const SOME_MUTATION = 'SOME_MUTATION'; export default { [SOME_MUTATION]() { ... } } 대문자와 대괄호라니 어딘가 이상해보인다. 먼저 상수로 선언된 Mutation 이름이 대문자인 이유부터 알아보자. Vuex 공식 문서를 확인해보니 일반적으로 Flux 패턴에서 Mutation의 이름을 상수로 표현한다고 한다. Mutation과 Action이 많아질 경우 전체적인 흐름을 파악하기 힘들어 진다. 이 때 상수로 정의된 Mutation을 별도의 파일에 모두 분리할 수 있다면 Import 하는 방식을 통해 Mutation의 흐름을 한 눈에 파악할 수 있다. 또한 오타로..
Express.js와 Vue.js로 만드는 SPA(Single Page Application) Part 2. 이전 Part 1에서 우리는 Express와 Vue를 연동한 개발 환경을 구축했다. Part 2에서는 Express와 MongoDB를 이용해 REST API 서버를 구축하는 과정을 다룬다. Mongoose 설치 Mongoose란 MongoDB ODM(Object Document Mapping) 중 하나이다. Mongoose를 이용하면 Object와 Document를 매칭할 수 있다. 즉, Mongoose는 Document를 DB에서 조회할 때 자바스크립트 객체로 바꿔주는 역할을 한다. 다음 명령어를 이용해 backend에 mongoose를 설치하자. $ npm i mongoose --s MVC 구축 Node.js를 사용하면 Ruby On Rails나 Django와 달리 원하는 형태의 디자인 패턴을 구축하..
[Github] Fork부터 Pull Request까지 최근 Vue.js를 이용한 프로젝트에 Buefy라는 Bulma 기반의 UI Framework를 사용한 적이 있었다. 당시 Buefy의 Datepicker라는 기능을 사용하던 중 이벤트 이후 자동으로 Date Window가 열리는 버그를 발견했다. 처음엔 버그가 아닌 내 실수라고 생각하고 코드를 이리저리 수정해봤지만 현상은 바뀌지 않았고, 버그라고 확신이 든 후 해당 버그에 대한 Issue를 Buefy Github에 등록했다. 그리고 등록한 Issue에 답변이 달릴 때 까지 Buefy 프로젝트를 Fork해서 원인을 찾으려는 순간 3분만에 내가 등록했던 Issue가 Close 된 것을 확인했다. 내가 Issue를 잘못 등록했나 라는 생각과 함께 댓글을 확인한 결과 Buefy 개발자로부터 해당 버그는 1시간 ..
우리에게 REST API란? 최근 Thiago Marini라는 개발자가 Medium에 작성한 "Guys, REST APIs are not Databases"을 읽게 되었다. 해당 글은 REST 방식의 Open API를 구성할 때 개발자가 고민해야 할 점을 이야기하고 있다. Thiago Marini는 REST API를 만드는 개발자들이 흔히 REST API를 데이터베이스처럼 다루는 실수를 하고 있다고 말한다. "REST(Representational State Transfer)"는 말 그대로 어떤 프로토콜로 ‘무언가’의 상태를 전송하는것을 의미한다. 일반적으로 HTTP가 선택되며, 무언가는 리소스(Resource)를 의미한다. 그리고 상태(State)란 리소스의 스냅샷(Snapshot)이다. 많은 문서들이 GET: Read, POST..
AUSG (AWS University Student Group) 2부 해당 글은 AUSG 1부에서 이어집니다. 아직 1부를 읽지 않으신 분은 1부를 먼저 읽고 오시는 것을 추천드립니다. > AUSG (AWS University Student Group) 1부 보러가기 활동 최근 디자인 팀에서 AUSG 홍보 자료를 제작했다. 그렇다. AUSG는 늘 새롭고 짜릿하다. 작년 8월부터 지금까지 내가 경험한 AUSG는 평범한 것이 없었다. 가장 먼저 했던 것은 세미나 발표였다. AUSG는 기획과 디자이너, 그리고 개발자로 구성되어 있다. 그리고 개발자는 반드시 AUSG 주관 세미나에 스피커로 참여해야 한다. 나는 호기롭게 두 번째 세미나 순서를 차지했다. 그 이유는 지금까지 내가 해 온 개발에 대한 자신감이 있었고, 발표해 본 경험도 있었기 때문이다. 하지만 세상은 뜻대로 흘러가지..