Skip to content

ntk221/notion_clone

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

60 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Notion_clone

概要

以下の機能をサポートしています。

  • 記事の作成,読み込み,更新,削除機能
  • ユーザーの新規登録機能
  • ログイン機能

アプリケーションの構成

フロントエンド: React.js + TypeScript

  • UIライブラリとして Chakra UI を使用しています。
  • 記事の編集ページでは,サイドバーにユーザーの記事一覧を表示し,選択した記事を編集できるようにしています。
  • 選択した記事のCRUD操作を行うフォームを実装しています。

バックエンド: Node.js + Express.js

  • APIサーバーとして機能し、クライアントからのリクエストに応じてデータのCRUD操作を行います。
  • MongoDBをデータベースとして使用しています。
  • ユーザーの認証にJWTを使用しています。

パッケージ管理にはnpmを使用しており、monorepo構成にするためにnpm workspaceを使用しています。

使い方

アプリケーションのインストールを以下の手順に従って行います。

  1. ターミナル上で,このリポジトリをクローンします。
git clone git@github.com:ntk221/notion_clone.git
  1. クローンしたリポジトリに移動して,プロジェクトのルートディレクトリでnpm installコマンドを実行し,アプリケーションの依存関係をインストールします。
cd notion_clone
npm install

次に,アプリケーションに必要な設定を行います。アプリケーションを起動するために,backendディレクトリに.envファイルを用意する必要があります。

cd packages/backend
touch .env

.envファイルには,MongoDBのURIを表すMONGO_URIと,JWTトークンのための秘密鍵を表すJWT_SECRETの値を設定してください。

次に,アプリケーションの起動は以下の手順に従います。

  1. ターミナルを2つ起動します。

  2. 一方のターミナルで次のコマンドを実行します。

npm run start:backend

サーバーが立ち上がると,start listeningというメッセージが表示されます。

  1. もう一方のターミナルで次のコマンドを実行します。
npm run start:frontend

http://localhost:3000にアクセスするとアプリケーションが使用できます。

参考サイト,書籍など

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published