Skip to content

Latest commit

 

History

History
78 lines (50 loc) · 3.05 KB

README.en.md

File metadata and controls

78 lines (50 loc) · 3.05 KB
Raw

Introduction

This project is the blog that is made with the javascript framework named Next.js. it is compatibled with the blog-api-server

한국어(Korean) 문서

Contributors
BE: Jinseok Eo

Features

Category Editor

The category editor allows you to create a category with a hierarchical structure. You can create a category with a parent-child relationship. You can also change the order of the category by dragging and dropping using react-dnd

code-13

Blog Post Editor

You would be able to write the a new post using TUI-Editor, it is able to select the category after clicking the category select box. You can also upload the image to the AWS S3 bucket. and it supports the code highlight feature that used a dark theme.

🛠️ Tech Stack

  • Typescript
  • Next.js
  • Material-UI
  • Mobx
  • SWR

Period of Development

2022.10.10 ~ 2022.11.15 (about a month)

Todo List

  • Creating layouts
  • Apply State Management Library (Mobx)
  • Administrator Tool
  • Creating a Hierarchical Categories using Nested Model
  • Post (Pagination, Search, Write, Read, Delete)
  • Image Upload Using AWS S3
  • Copy Post Link
  • Integrate with External Comment Plugin
  • Code Highlighting
  • Apply SWR to certain pages such as a page named posts/[id].tsx
  • Apply Open Graph
  • Porting with Next.js

Installation

To start this project, you must have Visual Studio Code and Node.js LTS v16 or higher installed. The node package manager uses yarn. yarn berry is faster, but pure yarn is used. Before starting this project, you must download the dependency node packages.

Open the integrated terminal or text editor (VS Code) and press Ctrl + ` or use the integrated terminal open feature to open the terminal at the bottom.

You can install all project dependency packages with the following command.

yarn install

When the above command is executed, the dependency packages will start to download. It may take several seconds or a minute or more, so please wait a moment. When the package download is complete, enter yarn next:dev in the terminal to start the development server.

yarn next:dev

This development server supports HMR (Hot Module Reload) via Webpack, so when you save the project, the browser will apply the CSS or tag (V-DOM) changes immediately.

Please open the http://localhost:8080 in the browser to see the result.

Deployment

This project is deployed a docker image using the GitHub Action and Github Package. The server automatically restarts using AWS CodeDeploy.