Nextjs 13 과 비교해서 문법, 구조가 바뀐것은 없습니다. 1. Turbopack 을 이용해서 빠른 개발을 할 수 있게 되었습니다. 로컬 서버 시작, 코드업데이트시 더 빠른 새로고침을 지원합니다. 로컬 서버 시작 속도가 최대 53% 가 빨라지며, 업데이트는 94% 향상되었습니다. npx create-next-app@latest // next.js 14 2. Server Actions 안정화 use client, user server 의 기능이 기존 alpha 에서 stable 로 업데이트 되었습니다. 아래는 공식문서 예제 입니다. export default function ServerComponent() { async function myAction() { 'use server' // ... } }..
해당 문제는 github 에서 Personal access tokens 를 설정하여 사용시 workflow 를 수정할려고 할 때 발생합니다. 권한 설정을 workflow 까지 허용하지 않아 발생하는 문제로 해당 문제는 workflow 권한을 주면 해결됩니다. 아래와 같이 workflow 권한을 허용해서 업데이트 하면 해결됩니다.
db 를 connect 해서 사용하지 말고 API 를 호출해서 사용하기 위한 EndPoint 를 만들어주는 역할을 한다.루트에서 pages/api 폴더를 생성하면 endpoint 가 만들어지게 되며 이를 이용하여 api 를 만들 수 있다. /pages/api/post/write 라는 api 를 만들어서 사용해보자! 별도의 백엔드서버를 구축하도록 합니다. 위치는 루트에서 pages/api 폴더를 만드시면 Endpoint 가 생성되며 /api 로 접근이 가능해집니다. 아래 구성을 보면, pages/api 폴더 밑에 각 js 파일들이 만들어진 것을 볼 수 있습니다.우리는 이제 /api/post/write 를 생성해서 사용해보겠습니다.몽고 db 커넥트 후, 단일 객체를 insert 해줍니다.잘 완료시 redir..
detail/[동적 라우팅]/page.tsx 로 만들어주면 detail/1234 로 들어오는 url 값이 날라옵니다. 보통 상세페이지 조회시 id 값을 받아 페이지를 로드해줍니다. import { redirect } from "next/navigation"; 를 사용해서 id 값으로 검색했는데 없어서 에러가 발생한 경우, redirect 를 치도록 예외처리합니다. import { connectDB } from "@/util/db" import { ObjectId } from "mongodb"; import { redirect } from "next/navigation"; export default async function DetailPage(props: any) { let title = '' let c..
ECMA2022 에서 Error Cause 메서드가 나왔는데 이를 이용하여 좀 더 구체적인 에러 메시지 추가가 가능해졌습니다. 예를 들어, api 를 try/catch 를 이용해서 에러 예외 처리한다고 하면 아래와 같이 "user.api 호출하다가 무슨 에러가 발생하였습니다"와 같이 throw 를 날려줍니다. try { const res = await user.api(); return res; } catch (err) { throw new Error("user.api error"); } 이를 cause 메서드를 이용하면 좀 더 구체적으로 에러 표시가 가능해집니다. try { const res = await user.api(); return res; } catch (err) { throw new Error..
관계형 데이터베이스와 비관계형 데이터베이스 차이에 대해 간단하게 알고 가겠습니다. 관계형 데이터베이스열과 행이 있는 테이블(표 형식으로)에 데이터를 저장데이터 입출력시 SQL 을 사용해야하고 미리 스키마 정의, 데이터 중복을 피하기 위한 정규화안정적인 데이터 저장, 운영이 필요한 곳에서 사용하면 좋습니다.대표적으로 Oracle, MySQL 이 여기에 속합니다.비관계형 데이터베이스키 값 형식으로 저장함. {key: value}SQL, 스키마 정의, 정규화 필요없음. NoSQL 이라고도 부름분산처리에 유리하기 하기 때문에 대용량 데이터 처리에 좋음.대표적으로 몽고 DB 가 여기에 속합니다.몽고 디비 연동몽고 디비를 연동하기 전에 우선 Nextjs 와 몽고 디비 셋팅을 해줍시다.https://www.mongo..
- Total
- Today
- Yesterday
- vue composition api
- 타입스크립트
- vue router
- AWS
- Embedding
- NUXT
- nodejs
- 서버 to 서버
- webpack
- openAI
- 스벨트
- cors
- 티스토리챌린지
- docker
- Vite
- svelte
- seo
- NextJS
- Storybook
- 깃허브
- Github Actions
- vscode
- React
- Git
- 오블완
- dockerfile
- nextjs13
- nextjs14
- nuxt2
- 네이버 서치 어드바이저
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 | 31 |