Michael Thomas 94082b2e3e | ||
---|---|---|
.github | ||
src | ||
.editorconfig | ||
.eslintrc.js | ||
.gitignore | ||
.prettierrc | ||
README.md | ||
netlify.toml | ||
nuxt.config.js | ||
package.json | ||
yarn.lock |
README.md
nuxt-portfolio-dev
a portfolio for developers w/ a blog powered by Notion
Demo: https://aymaneMx.com
Features
- 🥰 minimal and clean portfolio
- 🌗 the dark/light mode (Auto detect the system color-mode)
- 📱 responsive (tablet & mobile friendly)
- ⚙️ render articles from Notion 🚀
- ⭐ fetches your Github pinned projects with most stars
- 💫 Eslint & Prettier configured
- 📈 google analytics integration
- ⚡ generate sitemap (visit /sitemap.xml)
- 🚀 one click deployment to netlify
Prerequisites
- create Notion account
- duplicate this template by clicking on "duplicate" button located at the top of the page.
- make your notion table public (by clicking on "share" button located at the top of the page)
- grab the table id from the table link: eg:
link: https://aymanemx.notion.site/aymanemx/ceef6f1a895a46b2a0e4a87b41405547?v=8427738adccd4b2a8c28156be3757156
id: ceef6f1a895a46b2a0e4a87b41405547
- do the same thing for about page id (we gonna use it as an env variable NOTION_ABOUT_PAGE_ID)
- get your Google analytics id (optional)
- now you can click to the deploy button and fill the netlify form
Build Setup
create a .env
file with the following variables
BASE_URL=https://aymanemx.com
GOOGLE_ANALYTICS_ID=
NOTION_TABLE_ID="ceef6f1a895a46b2a0e4a87b41405547"
NOTION_ABOUT_PAGE_ID="ad2346af0894443d8906cf78de4f310f"
GITHUB_USERNAME=aymaneMx
DEV_LOGO="AymaneMx"
DEV_NAME="Aymane max"
DEV_DESCRIPTION="a passionate Python developer from Morocco who loves to build and deliver quality products."
DEV_ROLE="Software Engineer"
DEV_GITHUB_LINK="https://github.com/aymaneMx"
DEV_TWITTER_LINK="https://twitter.com/aymane_max"
DEV_LINKEDIN_LINK="https://www.linkedin.com/in/aymane-mimouni/"
then:
# install dependencies
$ yarn install
# serve with hot reload at localhost:3000
$ yarn dev
Credits
- 🌔 The dark mode : eggsy
- 🎨 the minimal design : Monotone
- ⭐ The open source section : mouadziani and smakosh