designer DK의 블로그

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

풀스택 todo-app제작의 마지막 단계인 프론트엔드 배포. 기존에 해오던대로 netlify로 배포를 진행했다. netlify로 배포하면 git-hub연동이어서 업로드 과정도 매우 편하고 무엇보다 무료로 배포+도메인주소도 얻을 수 있어서 너무나 좋다. 로그인을 깃허브로 진행하면 깃허브 파일들을 연동시켜서 사용할 수 있다.  add new site 버튼을 누르고 import existing project를 진행.  여기서 깃허브를 누르고 내가 깃허브에 올린 리포지토리를 선택해주면 된다.  여기서 사이트네임을 설정할 수 있는데 이 사이트 명이 내 사이트 url 주소가 된다. 겹치는지 체크 필요!  Deploy를 진행하면~   이렇게 내가 만든 사이트를 퍼블리쉬할 수 있다. 잠깐 기다려서 퍼블리쉬 완료를 확인..

약 두 달 전에 시작한 개인 프로젝트인 ‘킨더서울’ 웹사이트를 드디어 오늘 배포하였다. 아직 몇가지 아쉬운 부분이 있지만 그런 부분들은 일단 배포 후 조금씩 다듬어나가보려고한다. https://kinderseoul.netlify.app/   깃허브에 올라간 파일을 넷틀리파이(netlify)로 연결해서 간단하게 배포를 진행했다. 넷틀리파이는 깃허브 데이터를 그대로 연동 배포 가능해서 굉장히 사용이 편리하다.    마지막 작업은 디자인을 css로 옮기는 작업이 대부분이었고 자잘하게 막힌 부분들도 있었지만 큰 어려움 없이 완수할 수 있었다. 사이트는 데스트탑, 태블릿, 모바일 모두 커버할 수 있는 반응형 웹사이트로 구축했다. /* ----------------미디엄 레이아웃 : 태블릿--------------..

나의 첫 공식 퍼스널 개발 프로젝트는 '한국영화 박스오피스 순위' 웹사이트였다. (약 1달 전 퍼블리쉬)원래 '환율 계산기' 사이트를 첫 공식 프로젝트로 제작하고 있었는데개발 중에 너무 심하게 막히는 부분이 있었어서 잠시 미루고나름 쉽게 도전해볼만하겠다?! 라고 생각해서 덤벼 본 프로젝트가 바로 이 프로젝트였다. 마침 영화진흥위원회라는 곳에서 일간 박스오피스순위, 주간 박스오피스 순위 등의좋은 오픈API 소스를 제공하고 있었고그 정보를 가지고 사이트를 만들어보면 재미있고 유용하겠다고 판단해서 만들어 본 사이트. https://koreanmovieboxoffice.netlify.app/ 깃허브 : https://github.com/designerDK/KOREAN-MOVIE-BOX-OFFICE   하지만 좀..