Medium Clone

📌 Overview

/pages

✔️ pages/index.tsx = Homepage and list all Blogs
✔️ pages/post/[slug].tsx = Details Blog

/pages/api

✔️ pages/api/createComment.ts = API createComment that store data to sanity studio

🛠 Get started

Getting the API Keys

Create an .env.local and follow the name .env.example and get the API Keys based on the steps below

Sanity API KEYS

1. Create a Sanity account
2. Create new project
3. npm install -g @sanity/cli && sanity init
4. After you create new project, Go to your project, you will see the PROJECT ID at the top

5. After that you need to go to -> API -> TOKENS -> ADD API TOKEN -> ENTER YOUR PROJECT NAME -> CHOOSE THE ACCESS PRIVILEGES FOR THE TOKEN(PERMISSIONS) -> CHANGE PERMISSIONS TO EDITOR

6. Put it into the environment variables according to .env.example and you're all set!
   

Deploy your own

Deploy the example using Vercel:

⚙ Tech Stack

• Javascript
• ReactJS
• NextJS
• Typescript
• TailwindCSS
• Sanity

Starting the Project

Install the dependencies with npm i or yarn
Start the project by npm run dev or yarn dev

How to use

Execute create-next-app with npm or Yarn to bootstrap the example:

npx create-next-app --example with-tailwindcss with-tailwindcss-app
# or
yarn create next-app --example with-tailwindcss with-tailwindcss-app

Deploy it to the cloud with Vercel (Documentation).