김종현의 개발자 일기 김종현의 개발자 일기

- 화면을 만들기 위한 javascript 라이브러리 - 현재 기준 가장 많이 활용되고 있는 인기 있는 라이브러리 - 사용자와 상호 작용이 가능한 동적 UI 제작 가능 - 동적 사용자 인터페이스를 만들기 위해 2011년 페이스북에서 만든 오픈 소스 javascript 라이브러리 - 데이터 변경이 잦은 복잡하고, 규모가 큰 라이브러리에 적합 - ex) 페이스북, 인스타그램, 넷플릭스, 야후, 드롭박스 등등 React 특징 1. Data Flow 2. Component 기반 구조 3. Virtual Dom 4. Props and State 5. JSX 1. Data-Flow - 단방향 데이터 흐름 2. Component 기반 구조 - Component : 독립적인 단위의 소프트웨어 모듈로 독립적인 하나의 부..

어제까지 html, css, javascript 를 이용한 프로젝트가 마무리되고, node.js에 대해 배워보는 시간이었다. node.js란? - 구글 크롬의 자바스크립트 엔진에 기반해 만들어진 javascript 런타임 - 이벤트 기반, 비동기 I/O 모델을 사용해 가볍고 효율적 - npm 패키지는 세계에서 가장 큰 오픈 소스 라이브러리 그럼 여기서 런타임이라는 것이 궁금해질 것이다. 런타임이란? - 프로그래밍 언어가 구동되는 환경(예를 들어 파이썬, java, node.js) - javascript의 런타임 환경은 웹 브라우저만 존재했으나, - node.js로 웹 브라우저 없이 실행 가능 node.js 설치 - 이 설치과정도 정말 많은 고생을 했다. 분명 리더님께서 가르쳐주신 방법으로 다 똑같이 하는..

프로젝트하느라 정신이 없어서 프로젝트를 끝내고 나서야 회고를 적는다. 9일간 진행되었으며, 3일 차정도까진 블로깅을 한 상태라 프로젝트에 대한 간단한 설명 후 하루하루 어떻게 진행되었는지 써보려고 한다. 프로젝트명 : 2시에뭐해? 나 포함 4명이서 진행하게 되었고, 주제를 정할 때 조원 모두가 공감할 수 있는 주제로 가는 게 중요하다고 생각하였기에, 첫날 모여서 주제 회의를 하던 도중 다들 교육 마치고 식사를 하러 가던지 공부를 하기 위해 카페를 가던지 고민하던 게 비슷하였기에 해당 주제로 정하게 되었다. 4일 차 : 깃헙 및 css 깃헙 문제를 팀원 와 리더님께 물어보며 잘 해결해보려 하였고(아직은 익숙하지 않다..) 해당하는 카테고리를 눌렀을 때에 맞는 가게 정보가 나오게 하기 위한 작업이 마무리되었..

벌써 프로젝트 3일 차이다.. 사실 오늘은 정말 단순반복한 작업밖에 없어서 쓸 내용이 그렇게 많지는 않다. 어젯밤까지 집에서 자료조사를 했지만, 너무 많아서 팀원들과 지역 및 상권 수 조정을 하였다.(처음에는 몰랐는데 조사하다 보니 끝도 없다는 걸 느꼈다.) 그래서 오늘도 꾸준하게 자료조사가 거의 다 되었다. 나랑 같이 자료조사를 하는 조원은 두 번째 페이지 코딩에 들어갔다. 틀에 맞춰 정리한 자료들을 html에 쉽게 넣기 위해 js파일에 우리가 원하는 틀로 다시 바꾸어 정리를 하는 과정을 거쳤다. 이런 식으로 정리하였고, 사진으로 보니 정말 별거 아닌 거 같지만 정말 쉬운 작업이긴 하다. 양이 문제였다.. 무튼 그렇게 하던 와중에 문제는 정말 예상치 못한 곳에서 생겼다. 내 브랜치에서 협업하는 브랜치로..

어제는 팀원들끼리 가볍게 ot의 시간을 가지며 가볍게 주제와 관련된 각자의 의견들을 여러 가지 경우의 수를 생각하며 대략적인 주제를 골랐다면 오늘은 그 주제의 구체화를 위해 9시에 만나자마자 회의에 들어갔다. 일단 배달에 관련된 주제를 잡을지, 주변 상권 소개(음식점, 카페, 놀거리 등등)을 두고 고민을 하였는데, 결국 주변 상권 소개 쪽으로 주제가 결정되었다. 그 이유는 배달 관련 앱 보다 항상 교육이 끝나면 배가 너무 고팠던 우리 조원들에게 모두가 공감할 수 있는 공동적인 주제였기 때문이었다. 그러므로 더더욱 모두가 흥미를 가지고 할 수 있게 되어서 내심 좋았다. 그리고 사실 프로젝트라는 개념을 처음 진행해본 나로선 정말 어떻게 해야 할지 몰랐었고, 팀원들도 프로젝트 경험이 많지 않아 사실 좋은 의견..

사실 개발이라는 것이 보통 여러 명에서 협업하는 경우가 많다. (물론 혼자 하는 것이 불가능한 것은 아님) 그 협업의 방식에 크게 waterfall과 agile 두 가지 방식이 있는데 단순하고 단계별 체계적인 방식으로 인해 진행상황을 한눈에 파악을 하기는 쉬우나, 체계가 잡힌 만큼 업무의 유연성과 속도가 더딘 편이며, 개발 요구사항이 초기에 정해지기 때문에 변경이 어렵다. 짧은 주기로 설계, 개발, 테스트, 배포 과정을 반복하기에 변화에 신속하게 대응할 수 있으며, 요즘같이 민감한 변화에도 빠르게 변하는 IT시장에선 이 agile 방식을 선호하고 있는 편이다. agile의 종류가 나누어지는데 그중 kanban과 scrum에 대해 알아보자. - 개발자와 고객 사이의 지속적인 커뮤니케이션을 통해 요구사항 수..

bootstrap bootstrap이란 웹 사이트를 쉽게 만들 수 있도록 도와주는 공개 HTML, CSS, JS 프레임 워크 *프레임워크란? - 어떤 프로그램을 만들기 위한 기본 틀 사용방법 bootsrap 홈페이지 접속 상단 바에 Docs 클릭 후 getting start 메뉴에서 Download 클릭 CDN via jsDelivr 아래 있는 링크 복사하여 head 태그 안에 붙여 넣기 하면 사용준비 완료! 들어가면 정말 여러 가지 요소들과 테마들이 많다.(물론 테마는 사용하려면 유료임.) 앞으로 사용하면서 익숙해져야 할 거 같다. 오늘은 그중 아이콘 사용 방법을 알아보았다. bootstrap 홈페이지 상단에 Icons 클릭 후 아래쪽에 Install을 클릭하면 CDN 아래 있는 첫 번째 링크 복사 후..

jquery란 javascript 언어를 좀 더 간편하게 사용할 수 있도록 단순화시킨 오픈 소스 기반의 javascript 라이브러리 - 큰 장점이라고 한다면 보다HTML DOM을 손쉽게 조작 가능하며, 같은 동작을 하더라도 짧게 구현 가능 jquery 사용 방법 다운로드 받아서 사용하는 방법 CDN(content Delivery Network) 사용 (링크만 복사해서 오면 되는 거라 간편하고, 교육 시간 때엔 이 방법으로 하였다.) google에 jquery 검색 후 CDN 클릭하면 이 창이 뜨는데 여기서 jquery core 3.7.0 - uncompressed 를 클릭하면 파란색 버튼을 누르면 스크립트가 복사가 되며, head 태그 안에 붙여넣기 하면 jquery 사용 가능하다. jquery의 기초..