Overview:
Guillermo de la Puente’s Personal Site version 2 is a portfolio website that showcases his work and blog posts. It utilizes various technologies such as Next.js, Notion API, Chakra UI, and MDX to create a user-friendly and developer-friendly experience. The site also incorporates features like a contact form powered by FormBold and a dynamically generated RSS feed.
Features:
- Notion as CMS: Each blog post is a Notion page in a Notion database, and during build time, all pages are statically generated using the Notion API.
- NotionPageRenderer component: To render the blog posts, a NotionPageRenderer component is implemented, which allows for efficient parsing and rendering of Notion content.
- Markdown for content: The portfolio project descriptions use markdown, parsed to React using @next/mdx, making it easier to write and edit large chunks of copy.
- Contact Form powered by FormBold: The contact form backend is integrated with FormBold, providing a simple and easy-to-use solution for creating forms and handling form submissions.
- Dynamic RSS feed generation: The site generates an RSS feed in XML format, dynamically pulling the blog posts and including them in the feed. The feed is accessible at https://guillermodlpa.com/rss.xml.
Installation:
To install Guillermo de la Puente’s Personal Site, follow these steps:
- Clone the repository:
git clone [repository-url]
- Install dependencies:
npm install
- Start the development server:
npm run dev
- Access the site locally at
http://localhost:3000.
Summary:
Guillermo de la Puente’s Personal Site version 2 is a well-designed portfolio website that leverages Next.js, Notion API, and other technologies to create a seamless experience for both developers and users. The use of Notion as a CMS allows for easy management of blog posts, while markdown and FormBold simplify content creation and form integration. Additionally, the site implements dynamic RSS feed generation to keep users updated with the latest blog posts. Overall, this personal site showcases Guillermo’s skills and expertise while providing a smooth user experience.