지난 날 힘겹게 NextJS와 Apollo Server, Client을 한 프로젝트에 설정했다. 이제 DB 연동해서 사용하면 되는데, 테이블을 추가하면 GraphQL Schema도 추가해야되는게 너무 귀찮았다. 그래서 Prisma2을 적용해봤다. 결과는 대대대만족!!! 혹시 나처럼 NextJS로 백엔드와 프론트엔드를 같은 프로젝트(단순히 폴더를 나눈게 아닌 동작 프로세스가 하나로 이뤄지는 경우)로 하고 싶은 행인이 있을까싶어 git에 올렸다. github.com/yelling95/example-nextjs-apollo-prisma.git yelling95/example-nextjs-apollo-prisma NextJS로 프론트엔드, 백엔드를 같은 환경에서 구동시키고 Apollo와 Prisma로 DB 연동..
추석연휴 포함해서 약 2주일동안 정말 삽질을 많이 한 것 같다. 사실 아직 파야할 곳이 많아 막막하지만 그래도 물꼬가 트여서 써본다. 삽질 포인트는 아래와 같다. 1. Apollo Client와 Apollo Server는 둘다 있어야 되는건가? -> Yes 2. NextJs는 Server Render 방식인데, Server에 Apollo Server 설정을 할 수 있나? -> Yes 3. Typescript, NextJs, Apollo Server/Client을 모두 한 프로젝트에서 사용할 수 있나? -> Yes 1번 포인트에서 많이 헷갈렸던게 나는 Apollo Client가 Query을 실행하면 쿼리로 요청한 값만 전달되어 서버측 Model VO에서 해당부분만 값이 셋팅할거라고 생각했다. 그래서 Apo..
1. DB 접속 정보 Config 만들기 DB 정보는 환경변수로 관리하고 싶어서 dotenv 모듈을 설치해 아래와 같이 .env 파일을 만들었다. DB_USER=... DB_PASSWORD=... DB_HOST=... DB_PORT=... DB=... 그리고 /config/db.js을 만들어서 require로 불러올수 있도록 export 했다. require('dotenv').config() module.exports = (() => { return { "user": process.env.DB_USER, "password": process.env.DB_PASSWORD, "host": process.env.DB_HOST, "port": process.env.DB_PORT, "database": proces..
NextJS는 Pre-render을 지원하는데 화면 먼저 그리고 서버에 데이터를 가져와 보여주는 식이다. Pre-render는 크게 두 가지로 구현할 수 있는데, Static 방식과 Server-side 방법이 있다. Static : html 먼저 그리고 데이터를 뿌는 방법 Server-side : 서버에서 데이터를 가져와 html을 보여주는 방법이다. 짧은 영어 독해 능력으로 열심히 해석해보니까, Static 방식은 처음에 보여지는 속도는 빨라도 데이터 변경이 자주 발생하면 좋은 방법이 아니고, Server-side 방식은 조금 느릴수 있어도 데이터가 계속 바뀐다고 한다. Static 방식도 getStaticProps에 'async'을 같이 쓰면 동기되어 데이터를 다 가져오고 html을 그린다고 한다...
오랜만에 DB을 해서 두근두근하다. 회사에서 많이 사용중인 DB라 궁금했었는데 이번에 Beter 프로젝트 진행하면서 사용해보려고 한다. 먼저, 설치를 하러 가봅시다. www.postgresql.org/ PostgreSQL: The world's most advanced open source database PostgreSQL is a powerful, open source object-relational database system with over 30 years of active development that has earned it a strong reputation for reliability, feature robustness, and performance. There is a wealth of..