How to copy this website in 10 minutes

Start the timer and let’s cut to the chase.

Step 1: Clone the Repository

Head over to this GitHub repo and click Use this template.

Install dependencies:

javascript
pnpm install

Step 2: Set Up Notion

Create an Integration with Notion and save your integration secret.

Duplicate this Notion Template and add your integration to the root page:

Copy the database id’s of the Blog, Resume, and Projects pages. Do this by opening each page, copying it’s URL and getting the first id seen in the URL, for example:

https://www.notion.so/Next-JS-Notion-Portfolio-Starter-Docs-4b0b9dec8a214bdaaf48d7d94aaafdae?pvs=4

The ID of the page is 4b0b9dec8a214bdaaf48d7d94aaafdae.

Create and paste all the values you collected above into a file called .env.local , follow the example in .env.example.

Step 3: Start the app

Now you should be safe to start the app with no errors:

javascript
pnpm dev

Step 4: Customize

Make sure to first change the values in the src/app/bio.ts file to match you own information.

Afterwards, edit your Notion pages with your projects, resume, and blog posts.

Step 5: Deploy

Once you’re ready, commit the code to your own repository. From here I recommend deploying on Vercel.

Step 6: Admire Your Work

Congratulations! You’ve just created a portfolio that even Michael Scott would be proud of. It’s time to share it with the world, or at least with the people of Scranton.