Gatsby Creative

Overview:

This article discusses the implementation of Start Bootstrap’s Creative template using Gatsby. It mentions the key features of the implementation, such as the use of React Bootstrap and GitHub Actions for deployment. The article also highlights some differences in the template due to the transition from jQuery to React.

Features:

• React Bootstrap: The implementation of the Creative template uses React Bootstrap, a library that provides Bootstrap components and functionality in React.
• Start Bootstrap Creative: The template being implemented is Start Bootstrap’s Creative template, which provides a stylish and modern design for websites.
• GitHub Actions: The project includes an example of deploying the Gatsby site using GitHub Actions, which automates the build and deployment process.
• React Scrollspy: The implementation uses React Scrollspy for scrolling to page sections, providing a smooth scrolling experience for users.
• Template Differences: Some changes have been made in the implementation to adapt from jQuery to React, such as using the browser scrollTo function instead of jQuery animation for scrolling to page sections.
• Portfolio Carousel: The portfolio carousel in the template utilizes React Bootstrap functionality for modal and carousel, rather than using Magnific Popup.

Installation:

To install the Gatsby implementation of the Creative template, follow these steps:

1. Create a new Gatsby site using the Gatsby CLI:

gatsby new [project-name] https://github.com/[username]/[repository]

2. Navigate into the project directory:

cd [project-name]

3. Start the development server:

gatsby develop

4. Open the source code in your preferred code editor and make any necessary changes to the src/pages/index.js file. The browser will update in real time as you save your changes.

Summary:

This article discusses the implementation of Start Bootstrap’s Creative template using Gatsby. It highlights the key features of the implementation, such as the use of React Bootstrap and GitHub Actions for deployment. The article also provides installation instructions for setting up the Gatsby site.