전체 글35 Nginx로 React, Node 3-Tier Architecture 적용하기 Nginx를 설치하고 HTTPS를 적용해보자 (with Ncloud, Google Domains) 에서 Nginx를 통해 HTTPS를 적용해봤습니다. 이번에는 Ncloud에서 인스턴스를 생성하여 3-Tier Architecture를 적용해보도록 하겠습니다. 목차 3-Tier Architecture란? Presentation Tier 구현하기 Application Tier 구현하기 2편 추가 예정 Data Tier 구현하기 Object Storage로 데이터 백업하기 3-Tier Architecture란? 이번에 프로젝트를 하면서 처음으로 인프라 구조에 대해서 고민을 하게 되었습니다. 인프라에 대해서 공부를 해본 적이 없다 보니 어떤 구조가 있고 어떻게 설계를 해야지 효율적인지 몰라서 처음에는 생각을 많이.. 2021. 11. 3. Nginx를 설치하고 HTTPS를 적용해보자 (with Ncloud, Google Domains) 지난 NCloud로 서버 생성과 Mysql 연동 후 express 배포하기 - 2 에서는 Nginx 없이 주소와 포트 번호에 따라 서비스에 접근이 가능했습니다. 그러다가 나중에는 Nginx를 사용해야 한다는 말을 들었을 때 "Nginx 없이도 서비스가 잘 동작하는데 왜 Nginx를 적용시켜야 되지?"라는 궁금증이 생겼습니다. 그래서 먼저 Nginx를 사용해야 하는 이유에 대해 짚고 Nginx를 적용하는 법에 대해 알아보겠습니다 :) 목차 Nginx를 왜 써? Nginx 설치하기 Nginx 설정 파일 열어보기 Google domains에서 domain 구매하기 SSL 인증서 발급받기 (with certBot) Nginx에 HTTPS 적용하기 추가 Nginx로 React, Node 3-Tier Archite.. 2021. 10. 30. NCloud로 서버 생성과 Mysql 연동 후 express 배포하기 - 2 지난번에는 서버 생성과 기본적인 세팅 관련해서 글을 썼습니다. 이번 시간에는 어떻게 Express로 배포하고 mysql를 연동하는지에 대해 다뤄보려고 합니다. 목차 NCloud로 서버 생성과 Mysql 연동 후 express 배포하기 - 1 ncloud 서버 생성 acg 설정 포트포워딩 공인 아이피 신청 원격 접속 및 설정 git 설치 node 설치 pm2 설치 git clone mysql 설치 pm2 설치 우리가 알고 있는 node는 싱글 스레드로 유명합니다. 그래서 명확한 단점이 있는데 바로 서버가 쉽게 죽는다는 것입니다. 물론 다양한 해결법이 있지만 이를 적용하기에는 까다롭습니다. 다행스럽게도 이를 해결해주는 라이브러리가 있습니다. 바로 PM2입니다. PM2를 통해 우리는 무중단으로 서비스를 운영할.. 2021. 9. 23. NCloud로 서버 생성과 Mysql 연동 후 express 배포하기 - 1 얼마 전에 NCloud로 배포를 할 일이 생겼습니다. 그러나 배포에 대해 무지했고 AWS도 제대로 사용해본 경험도 없어 처음 배포 당시에는 엄청 헤매었습니다. 또한 AWS와는 다르게 비교적 선호도가 낮은 NCloud여서 검색 자료도 적어서 아쉬웠습니다. 그래서 이번에 제가 부딪히면서 알게 된 배포 방식을 공유해보려고 합니다 :) (사실 제가 까먹을까 봐 블로그에 기록하는 겁니다 ㅎㅎ) 목차 ncloud 서버 생성 acg 설정 포트포워딩 공인 아이피 신청 원격 접속 및 설정 git 설치 node 설치 NCloud로 서버 생성과 Mysql 연동 후 express 배포하기 - 2 pm2 설치 git clone mysql 설치 ncloud 서버 생성 먼저 배포를 위해 가장 필요한 서버를 생성해줍니다. nclou.. 2021. 9. 23. Forking Workflow에서 fetch와 rebase 들어가기 전에 최근에 부스트캠프 멤버십 과정을 진행하면서 git을 통해 과제 제출을 진행하고 있다. 그러나 난생 처음 들어보는 forking workflow 방식과 git fetch, git rebase등의 명령어를 사용하였다. 이를 바탕으로 나만의 방식으로 어떻게 이해했는지를 적어보려고 한다. workflow git을 공부하다가 branch를 feat, hotfix, relase, dev.. 이런식으로 나눈 것을 본적이 있을 것이다. 이처럼 협업을 위해 특정 규칙을 정의하고 branch를 나누는 것을 git workflow라고 한다. git workflow에는 다양한 workflow가 존재한다. 단일 중앙 저장소를 사용하는 centralize workflow 핵심 기능별로 branch를 나누는 feat.. 2021. 9. 5. flex로 깨달아버린 css layout 웹 개발 공부를 시작하고 항상 두려움에 떨어던 css를 이번 부스트캠프 멤버십 기간동안 지겹도록 하면서 깨달음을 얻은 지식을 바탕으로 작성하게 되었습니다. "뭔가 위 아래가 틀린데..?" "크기가 달라지면 깨지네..?" "이건 왜 이래?" 그동안 CSS를 하면서 이런 고민을 자주 했었다. 그렇다면 이 문제를 어떻게 해결할 수 있을까? 예시를 보면서 해결해보자 현재 나는 다음 그림처럼 CSS를 꾸미고 싶어 했다. 그래서 일단 기초적인 코드를 작성한다. css 뿌셔보자 이건 로고야 이건 회원 정보 위에 있는 이미지야 이건 회원 정보고 그러나 위 html 파일을 켜보면 아직 CSS가 구현이 안되어 이런식으로 동작한다... 그럼 어떻게 설계대로 구현 할 수 있을까? 1. display: inline-block과.. 2021. 8. 29. 이전 1 2 3 4 5 6 다음
