반응형 분류 전체보기38 Nuxt 3란 무엇인가? Vue 개발자를 위한 빠른 시작 Vue를 이미 알고 있다면 Nuxt 3는 마치 “Vue의 확장팩”처럼 느껴질 거예요.하지만 단순한 확장을 넘어, SSR 기반 SEO 최적화, 파일 기반 라우팅, 정적 사이트 생성(SSG) 같은 고급 기능들을 거의 설정 없이 제공하는 프레임워크랍니다.✅ Nuxt 3는 왜 쓰나요?기존 Vue 프로젝트에서는 직접 설정해야 했던 부분들을 Nuxt는 자동으로 해줘요. 예를 들어:기능VueNuxt라우팅vue-router 직접 설정파일 기반 자동 라우팅SEO 설정 직접 구성useHead() 제공SSR 구성webpack, express 등 따로 구성기본 내장정적 사이트 생성별도 플러그인 필요nuxt generate 한 줄이면 끝🧪 Nuxt 3 설치 및 프로젝트 생성bash복사편집npx nuxi init nuxt3-b.. 2025. 4. 14. Nuxt에서 말하는 SSR과 SSG 완전 정복 ✅ 1. SSR (Server-Side Rendering)💬 개념브라우저가 보기 전에, 서버가 먼저 HTML을 만들어서 보내주는 방식사용자가 페이지에 접속하면 서버가 HTML을 그때 생성함초기 로딩이 빠르고 SEO에 강함 (검색 엔진이 쉽게 읽을 수 있음)서버가 항상 살아있어야 함💻 흐름브라우저가 /posts 요청Nuxt 서버가 HTML을 서버에서 렌더링완성된 HTML이 브라우저에 전송됨브라우저에서 Hydration(인터랙션 가능하게) 진행🔧 Nuxt 설정 (기본값)Nuxt 3는 기본이 SSR 모드야. 따로 설정하지 않아도 동작해.ts복사편집// nuxt.config.ts export default defineNuxtConfig({ ssr: true }) 🧠 언제 쓰면 좋을까?SEO가 중요한 페이.. 2025. 4. 14. Nuxt 3로 블로그 만들기 #1 – Nuxt는 도대체 뭘까? Vue는 알겠는데... Nuxt는 뭔가요?Vue로 웹앱을 만들다 보면 어느 순간 이런 생각이 들어요."라우팅을 자동으로 해주면 좋겠는데...""서버도 같이 다룰 수 있으면 좋겠는데...""정적 사이트로도, SSR도 하고 싶고..."이런 고민을 해결해주는 게 바로 Nuxt.js입니다.Nuxt는 Vue를 기반으로 한 프레임워크로, Vue를 더 편하고 더 강력하게 쓸 수 있도록 도와줍니다.💡 Nuxt 3는 뭐가 다른가요?Nuxt는 현재 Nuxt 3로 진화했고, 내부적으로 많은 변화가 있었습니다.Vue 3, Vite, Nitro 등 최신 기술을 품고 훨씬 가벼워지고 빨라졌죠.Nuxt 2Nuxt 3Vue 2 기반Vue 3 기반Webpack 사용Vite 사용서버 기능 제한API, Middleware 등 백엔드 내.. 2025. 4. 14. [망고의 유튜브 도전기] 말투를 바꿔서 쇼츠를 올렸다 - 구독자 323 새로 올린 쇼츠로 구독자가 12명 가량 늘었다. 올린지 12시간정도 된 시점에 조회수는 약 6천 정도. 이번에 올린 쇼츠는 벤치마킹한 분의 톤과 말투를 따라서 영상을 제작했다. 특히 신경 쓴 부분은 첫 멘트 였는데 쇼츠의 특성상 첫 멘트가 궁금하지 않으면 바로 이탈하기 때문에 긴 영상 보다 훨씬 중요한 것 같다. 첫 멘트는 "수능 만점자가 쓴 걸 가져와봤는데" 로 시작했고 영상은 수능 만점자가 소개한 플래너를 보여주었다. 시작 부분의 결과는 엄청 괜찮았다. 평소 영상의 조회율에 비해 2배 이상의 좋은 결과를 냈으니까. (쇼츠는 조회율 * 시청지속 시간이 좋을 수록 많은 노출이 발생한다.) 그런데 특이한 점은 싫어요 비율이 굉장히 높은 영상이었다. 내 예상으로는 너무 짧게 하려다 보니 제대로 설명이 안되서.. 2024. 4. 15. 이전 1 2 3 4 5 ··· 10 다음 반응형
