/nuxt3-blog

A pure front-end blog written using Vue3, Nuxt3, and the GitHub API.一个使用Vue3,Nuxt3,GitHub API写的纯前端博客

Primary LanguageVueMIT LicenseMIT

💎Nuxt3-Blog

🚀https://blog.yunyuyuan.net

English Readme | 中文说明

Features

  • 💻 Build in 5 minutes. Completely free, no need to write any code.
  • 🤝 Convenient to use. An all-in-one admin interface where you only need a token to update configurations, add/edit/delete blog content on the web page. no notepad, no git push.
  • 📷 Integrated image hosting service. Integrated with smms image hosting service and tinypng image compression, one-click upload of blog images on the web page.
  • 🌐 Full static. Packaged as a full static website, no backend required.
  • 🔍 SEO-friendly. Each HTML page is pre-rendered and can be indexed by search engines.
  • 🔒 Can be encrypted. Any single article/record/knowledge can be encrypted, and content can be encrypted in block-level. Only by entering the password can it be viewed.
    • 🚪Full encryption:
    • 🚪Block-level encryption:

How to use

Two ways to deploy

The first way: One-click deployment (note：uncheck Create private Git Repository)

Deploy with Vercel

The second way: fork and deploy(recommended if you want to sync my future commits)

  1. fork this project
  2. deploy within vercel(no need to change any build params)

After deploy

Change user

Change githubName in config.ts to your current Github account.

Generate a new token

Goto https://github.com/settings/tokens/new, check repo scopes, then click Generate token.

Addons

Todo

Features

  • 404 page
  • work with npm run dev
  • testing
  • full-static site generate(SSG)
  • plugin system
  • serverless function to upload images
  • mongodb integration(views analyze)
  • algolia searching
  • images migration
  • changing password(only available while using npm run dev)

Appearance

  • dark mode
  • i18n
  • themes(need UI)
  • custom primary color
Low priority features
  • different password for every content
  • custom-syntax highlight for monaco editor
  • pulling update of upsteam github repo
  • IV for AES encryption
  • block level encryption
  • SSR for self-hosting
  • support cloudflare page,netlify and others

Project Structure

  • /api serverless functions.
  • /assets
    • /image images that imported by vite.
    • /style public style and utils style.
    • /svg all svg files, will used by /components/svg-icon.vue.
  • /components vue components, auto-import by nuxt.
  • /composables vue composables, auto-import by nuxt.
  • /vite-plugins vite plugins.
  • /i18n i18n message files.
  • /layouts nuxt layout files.
  • /lib functions used by /api.
  • /pages all views page.
  • /plugins nuxt plugin files.
  • /public
    • /rebuild all blog data.
    • /sticker all stickers for markdown.
  • /scripts
    • /generate.ts script for npm run generate.
    • /change-pwd.ts script for npm run chpwd, run it locally when you want to change your password.
  • /utils
    • /nuxt common codes of nuxt.
    • /common common codes of javascript.
  • /config.ts blog configurations, your must change it.

Changelog

CHANGELOG.md

Others