Table of Contents
This repo is what I use to power my personal blog and portfolio site mehdibha.co. It's perfect for building your own personal website if you are a developer, a designer, a researcher, a writer with almost everything customizable.
- ๐ Writing posts using Notion as CMS
- ๐ Pretty URLs & SEO friendly
- ๐ค Entirely customisable through one config file
- ๐ Fast page views
- ๐ผ Sleek Portfolio -> Showcase your work elegantly and professionally.
- ๐ Dark and light mode
- ๐ฑ Responsive design
- โป๏ธ Incremental static regeneration (Every x minutes re-update website content so no need to redeploy)
- ๐ฐ RSS feed
- ๐ Deploy on Vercel in minutes
- ๐ Search posts instantly
- ๐ Analytics with vercel analytics
- Dispaly your courses
- Next.js (v13 with app dir) and React
- Typescript
- Tailwind CSS
- Shadcn-ui as starter components
- React-notion-x
If you want to clone the project and make you personal notionfolio
- Star the repo
- Duplicate this Notion template, and share it to the public
- Fork this project
- Customize /src/config/site.ts
- Replace favicons and images /public
- Add NOTION_PAGE_ID as an env variable (see .env.exemple)
- Deploy on Vercel (do not forget to add env variables)
- Run script to update website for new features (yarn run update-template) (it syncs with this repo without changing config file and /public)
- Make the website responsive
- Projects archive page
- Generate a sitemap and robots.txt
- Implement RSS feed
- Add thumbnails to posts
- Implement analytics
- Infinite scroll in blog page
- CI / pre-commit hooks
- Introduce courses feature
- Introduce tools feature
- Make config more optionnal (config/site.ts)
- Collect emails
- Improve SEO and lighthouse score
- Auth + comments
- implement i18n
- Switch from react-notion-x to a custom component
- Make a website to generate notionfolios from it directly
We will be happy to mention you here, just make a pull request and we will add you
See the contribution guide and join our amazing list of contributors!
Distributed under the MIT License. See LICENSE
for more information.
Mehdi BHA |