본문 바로가기

분류 전체보기42

[위코드 2차 프로젝트] 개발은 체력으로 시작하고 공식문서로 끝난다.(feat.카카오API) 1차 프로젝트가 끝나고 바로 2차 프로젝트가 진행됐다. 이번에는 쇼핑몰이 아닌 '글이 작품이 되는 공간, 브런치'였다. 브런치는 작가가 되면 글을 연재할 수 있는 사이트다. 최근에는 연재를 모아 책으로 출판도 해준다. 이렇게 출판된 책들에서 베스트셀러도 많이 나오고 있다. 대표적으로는 문재인 대통령이 청와대 직원들에게 선물해준 '90년대 생이 온다', 베스트셀러 '어서 오세요, 휴남동 서점입니다' 등이 있다. 브런치는 단순히 작가가 되어 글만 올리는 공간이 아닌, 출판 플랫폼이 되어 가고 있다. 이번 프로젝트에서는 '브런치'를 모델링해 '브지런치(bZrunch)'를 기획했다. 브지런치는 가입하자마자 작가가 될 수 있는 사이트다. 자신의 글을 무료/유료 선택해서 올릴 수 있고, 유료 글은 독자들이 결재를 .. 2022. 12. 17.

[프로젝트 회고] 재밌었던 개념과 성장시킨 코드(feat.Layered Pattern) 1차 프로젝트를 마무리하고 성장했다는 것을 느끼고 있다. 프로젝트를 통해 느낀 점은 아래 글에 나와있다. [회고] 개발자는 꺽이지 않는 마음과 문제해결 마인드가 필요하다 사전 스터디 기간 포함해서 2달 동안 개념 학습을 하고 기다렸던 프로젝트가 시작됐다. 프로젝트 팀 발표 후 팀원들과 어색하게 인사를 하고 우리만의 웹사이트를 만들기 위해 기획회의를 진행 blog.business-traveler.co.kr 이 글에서는 이번 프로젝트를 통해 재미있게 이해했던 개념과 성장한 코드에 대해 써보려고 한다. 재미있었던 개념 : Layered Pattern Multi-tier 아키텍처 패턴이라고도 하는 Layered Pattern은 백엔드 API코드에 가정 널리 적용된 패턴이다. Layered 아키텍처는 코드를 논리.. 2022. 12. 3.

[회고] 개발자는 꺽이지 않는 마음과 문제해결 마인드가 필요하다 사전 스터디 기간 포함해서 2달 동안 개념 학습을 하고 기다렸던 프로젝트가 시작됐다. 프로젝트 팀 발표 후 팀원들과 어색하게 인사를 하고 우리만의 웹사이트를 만들기 위해 기획회의를 진행했다. 우리 팀은 프론트앤드 3명, 백엔드 2명으로 구성됐고, 29cm 쇼핑몰을 담당하게 됐다. 먼저 29cm의 비즈니스 로직을 파악했다. 29cm은 소비자들이 좋아할 만한 브랜드들을 큐레이션하고 브랜드 가치를 소비자들에게 알려줌으로써 소비를 이끌어내는 웹사이트였다. 29cm의 고객은 사용자와 브랜드였다. 브랜드관을 따로 만들어 브랜드는 가치를 홍보하고 소비자는 자신의 맞는 가치를 찾아 원하는 상품을 구매함으로써 만족도가 더 올라갈 것 같았다. 또한 다른 쇼핑몰들과 달리 느낌 있게(?) 브랜드관(PT페이지) 만들어놔 대표 .. 2022. 12. 3.

노드.js 초기환경세팅(express, typeorm) 프론트와 첫 기획회의를 마치고 백엔드 팀원과 함께 개발초기환경세팅을 진행했다. 초기환경세팅이란? 웹 개발 프로젝트에 앞서 사용하는 패키지들을 정하고 세팅하는 시간이다. 혼자개발을 진행하면 아무툴을 선택해서 진행하면 되는데 팀프로젝트는 팀원들끼리 어떤 툴을 쓸지 상의하고 공통된 툴을 다운받는 시간이 필요하다. 일종의 커뮤니케이션 수단이 생긴 것이다. 이 시간을 통해 회사에 간다면 그 회사에 맞는 초기환경세팅이 매우 중요하고 잘해야겠다는 생각을 했다. 어떤 것들을 설치했나? nodemon, cors, dbmate, dotenv,morgan,mysql2, express, typeorm을 설치했다. nodemon - Node에서는 코드에서 수정이 일어났을 때, 코드의 수정 사항이 서버에 자동으로 반영되지 않는다.. 2022. 11. 15.

팀프로젝트 시작(프론트와 planning meeting ) 위코드에서 백엔드를 선택하고 한 달 동안 백엔드 기본 로드맵, 노드.js, API, MySQL, Express, Typeorm, Authentication & Authorization, Layered Pattern 등을 차례대로 배웠다. 이제 배운 것을 토대로 첫 프로젝트가 시작했다. 팀은 프론트 3명, 백엔드 2명으로 구성됐다. 우리 팀이 클론 코딩을 진행하는 홈페이지는 29CM이다. https://www.29cm.co.kr/home/ 프론트와 첫 planning meeting을 가졌다. 이번 미팅에서는 서비스 소개, 필수 구현 사항, 추가 구현 사항, 개선 사항에 대해 토의를 했다. 1. 29CM 서비스 소개 - 29CM는 ' 고객의 더 나은 선택을 돕는다'라는 미션을 전개하는 온라인 셀렉트 샵! -.. 2022. 11. 14.

[node.js] 입문과정에서 어려움(module과 File system module) 백엔드 개발 공부를 위코드에서 node.js로 시작했다. 1. 배움 - Module(모듈) Module system은 node.js에서 가장 근본적이고 중요하다. 모듈화가 잘 된 코드는 재사용성과 확장성을 높여 새로운 기능을 개발하거나 유지보수할 때, 전체적인 비용을 감소시키고 개발팀의 생산성을 증대시킬 수 있다. 모듈은 module.exports 또는 exports 객체를 통해 정의하고 외부로 공개하고, 공개된 모듈은 require함수를 사용하여 임포트 할 수 있다. node.js에는 이미 만들어진 Built-in modules들이 있다. 처음으로 접한 Built-in modules은 File system module이다. 파일 시스템 모듈은 파일을 읽고 쓰는 기능입니다. 파일을 읽을 때는 동기(Syn.. 2022. 10. 27.

가독성 좋은 웹사이트 위한 CSS 레이아웃 알아가기(position, display) 화려하고 가독성 좋은 웹사이트를 만들려면?? 최근 웹사이트들을 보면 화려하고 가독성이 좋다. HTML, CSS, 자바스크립트를 활용해서 만들어야 한다. 웹사이트의 뼈대가 되는 HTML, 동적인 웹사이트를 위한 자바스크립트도 중요하지만 화려하고 가독성 좋은 웹사이트의 기본이 되는 건 CSS 레이아웃이다! 레이아웃이 잘 잡혀 있어야 글, 도형, 여러 가지 기능이 자기 자리에서 빛을 낼 수 있다. CSS 레이아웃에는 잘 짜기 위해서는 position과 display을 이해하고 넘어가야 한다. 먼저 position은 웹에서 element가 배치되는 방식을 결정한다. Value에는 static, relative, absolute, fixed가 있다. 1. stactic - 브라우저에 기본으로 설정되어 있는 값이다.. 2022. 10. 19.

Semantic Web과 Semantic Tag의 중요성 개발자 공부를 시작하고 웹에 대해 배웠다. 문제에서 이런 질문을 던져 줬다. "사이트에 이미지를 넣는 방법은 두 가지가 있습니다. 태그를 사용하는 것과 태그에 background-image 속성을 추가하는 것. 두 가지 방법의 차이점과 각각 어떠한 경우에 사용하면 좋은지 설명해보세요." HTML과 CSS를 이해함에 있어 태그는 매우 중요한 개념이다. 웹사이트는 태그로 시작해서 태그로 끝난다고 봐도 된다. , 태그를 사용해서 똑같은 결과물을 얻을 수 있다. 차이점을 이해하려면 필요한 개념이 Semantic Web과 Semantic Tag이다. Semantic을 사전에서 찾아보면 "의미의", "의미론적인"이라는 뜻이 나온다. 의미 있는 웹과 태그다. 단순히 생각하면 같은 결과물(시각적)을 얻기 때문에 의미는.. 2022. 10. 17.

[JavaScript]객체안에 객체 접근하는 방법 자바스크립트에서 객체는 매우 중요하다. 객체는 기본적으로 변수를 선언하고 {}(중괄호)를 통해 만들고 , {key: value , key value ······} 형식을 가지게 된다 그런데!! 객체 안에 객체가 있으면 어떻게 될까? 위와 같은 객체 안에 객체가 있다. 저번 글에서 객체에 접근하는 방법 2가지를 배웠다. Dot Notation과 Bracket Notation 2가지 모두 활용해서 접근하면 된다. "map"을 콘솔에 출력하려면 다음과 같이하면 된다. 첫번째 console.log가 Dot Notation과 Bracket Notation 2가지 모두 활용한 방법이다. key로 접근해 value를 출력한 것이다. Dot Notation는 띄어쓰기는 읽지 못하기 때문에 'glove box'는 Bra.. 2022. 9. 29.

[JavaSript] 객체에 저장된 데이터에 접근하기(Dot Notation vs Bracket Notation) 객체에 저장된 데이터에 접근하는 방법에는 Dot Notation, Bracket Notion 2가지가 있다. 1. Dot Notation Dot Notation는 단어 그대로 .(점)을 통해 객체에 저장된 데이터에 접근한다. 2. Bracket Notation Bracket Notation은 ['key'](대괄호)로 객체에 저장된 데이터에 접근한다. 그럼 둘이 차이점이 무엇일까? 결정적인 차이는 Dot Notation은 변수를 활용할 수 없고, Bracket Notation은 변수를 활용할 수 있다. 변수 myKey를 선언하고, Dot Notation 과 Bracket Notation 으로 콘솔에 출력해 봤는데 Dot Notation은 undefined 를 출력했다. 이유는 mySelf 객체안에 myKe.. 2022. 9. 28.

이전 1 2 3 4 5 다음

티스토리툴바