designer DK의 블로그

한달 좀 넘게 열심히 공부한 쇼핑몰 프로젝트를 드디어 완료했다!디자인 진행도 하지 않았고 여러가지 예외처리들도 모두 제외하고 진행하긴 했지만그래도 DB설계부터 프론트~백엔드 전 작업을 풀스택으로 경험해보는 좋은 공부였다. 마지막 배포는 지난번 포스팅의 절차처럼 DB 배포가 먼저 진행되고https://designerdk.tistory.com/28 mongoDB Atlas로 DB 무료로 배포하기강의를 통해 풀스택으로 '할일 앱'을 만들었고 배포하는 과정으로 들어갔다.가장 먼저 DB 배포를 진행했다. mongoDB atlas를 가입하고 클러스터라는 걸 만들어준다. (shared가 클러스터 1개까지 무료)designerdk.tistory.com백엔드 배포를 진행했다.https://designerdk.tistor..

주문 완료 페이지를 만들면서 주문 성공 시 주문번호를 생성해야했다.그에 따라 랜덤한 번호 생성 함수 코드를 가져와서 사용.//orderNum 생성에 사용const randomStringGenerator = () => { const randomString = Array.from(Array(10), () => Math.floor(Math.random() * 36).toString(36) ).join(""); return randomString;};module.exports = { randomStringGenerator };  이 함수를 사용하면 랜덤한 스트링이 생성되는데 이걸 이용해서 order 컨트롤러에서 응답해야하는 값을 만들었다.const orderController = {};const Order = ..

Html+js의 정통방식으로 프론트를 만들고 백엔드를 연결하다보니 주소 라우팅 등 이런저런 부분들이 요즘 많이 쓰는 SPA방식에 비해 한계가 느껴졌다. 그래서 정통방식은 유지하면서도 좋은 방식이 없을지 많이 고민해보았고 최근 나의 가장 큰 스승이자 베프인 gpt랑도 많은 이야기를 나눠봤다. 고민해본 결과로 이번 강의 예제는 프론트부터 백엔드까지 한 프로젝트로 관리해보기로 했다. 즉 한 프로젝트 안에서 프론트와 백엔드 api를 소통시키고 나중에 배포까지 클라우드타입과 같은 백엔드 호스팅 서비스에 한번에 하는 것이다. 이 방식의 장단점을 gpt와 많이 논의해봤었는데 아래와 같았다. 장점:단순화된 배포 및 유지 관리: 프론트엔드와 백엔드를 같은 서버에서 관리하므로 배포 및 설정 작업이 단순해지고, 한 번의 배..

강의에서는 백엔드 배포 방법으로 Heroku, Cloudtype, AWS를 제안해주었고 그중에 실 강의로는 Heroku와 AWS를 진행해주었다. 각기 장단점이 존재했는데 Heroku는 배포가 매우 간단한데 월 5000원이 들어간다는 단점이 있었다.클라우드타입(Cloudtype)은 배포가 편리하고 무료플랜이 있는데 무료플랜 시 하루에 한번 서버가 잠깐 꺼진다고 한다 ㄷㄷㄷAWS는 aws elastic beanstalk라는 서비스로 무료 배포가 가능한데 배포과정이 번거롭고 배포 중 에러발생률이 높다. 처음엔 무료이기도하고 그래도 개발 배우는데 aws 한번 써봐야지~라는 생각으로 aws 배포를 시도했으나 계속해서 발생하는 에러로 결국 포기하게 되었다. 그렇게 차선책으로 선택하게 된 Cloudtype. 하루 한..

강의를 통해 배우는 첫 백엔드 설정 예제를 진행해보았다. mongoDB와 node.js를 연결하고 백엔드 설정을해서 프론트엔드와 소통하는 할일 앱을 만드는 과제. 사실 한번에 너무 방대한 양을 배우는 데다가 페이지가 잘게 쪼개져 있어서 아직도 좀 아리송한 부분들은 있지만 대략적으로는 백엔드와 프론트엔드가 어떻게 돌아가는지 알게 된 것 같다. 시작 전에 npm을 이용해서 express, mongoose, body-parser를 설치. (바디파서는 이제 설치 필요 없음)express를 이용해서는 서버를 간편하게 열 수 있었고 mongoose를 이용해서 mongoDB 스키마를 설계할 수 있었다.const express = require('express');const mongoose = require('mong..

최근 만들어본 ‘킨더서울’ 사이트를 비롯해서 기존에 오픈 되어있는 api 정보들을 가져와서 만드는 사이트들을 여러번 만들다보니 자연스럽게 내가 자체적으로 서버와 데이터베이스를 구축해보고싶은 욕심이 생겼다. 지금까지 자바스크립트 위주로 공부해왔었는데 조사해보니 같은 자바스크립트 베이스의 백엔드 툴로 node.js가 괜찮아보였고 나의 코딩 바이블인 ‘생활코딩’사이트를 통해 node.js를 전반적으로 접해보니 너무 넘사벽 느낌이라기보다 한번 해 볼만 하겠다고 느껴졌다. 좀 더 깊숙하게 공부하면서 실용적인 기능들을 익혀가고 싶었고 (db사용법, 로그인, 주문, 결제 등)이리저리 서치해보니 ‘코딩알려주는누나’의 node.js 강의가 커리큘럼 상 실용적인 부분이 많아보였다. 할일앱부터 쇼핑몰까지 실전예제들을 다루는..

Motive서울시의 유치원 정보를 쉽고 편하게 열람할 수 있는 웹사이트 만들기 프로젝트. 원래 개발 스터디 목적으로 시작한 프로젝트였지만 기획을 해가면서 실제 유입되는 사용자들에게 유의미하고 사용성 좋은 사이트로 만들고 싶은 욕심이 생겼다. 그런데 서치를 해보니 이미 교육부에서 운영하는 ‘유치원 알리미’라는 사이트가 있었고 데이터베이스도 훨씬 방대했다.  유치원알리미는 전국 단위로 유치원 검색이 가능하고 어린이집과 유치원 모두 다뤘다. 그래서 데이터면에서 넘사벽이긴 했지만 그만큼 데이터를 조회하는데 다소 느리다는 단점도 발견했다. 그리고 이런저런 다른 정보들도 많이 다루다보니 ‘사용자가 어떤 특정 유치원 정보를 열람하겠다’라고 했을 때 약간은 사용성이 복잡한 면이 있었다.  Project goal따라서 ..