Kick-off your Portfolio website. We have used Gatsby + Contenful.
Pictures from:
- Blogs listing with each blog post.
- Contact form with Email notification using formspree.io.
- Photos and Blogs page listing.
- Different types of sections like About, Service, Blogs, Work, Testimonials, Photos, and contact.
- All settings manage from contentful for example Header Menu, Homepage sections, blogs, and photos, etc.
- Social share in blog details pages with comment ( Disqus ).
- PWA
-
Setup this site.
Use the Gatsby CLI to Clone this site.
# Clone this Repositories gatsby new portfolio https://github.com/bgreengo/blakegreen-dev.git -
Setup Contentful Models
Use contentful-cli to import the models from contentful-data.json
contentful space --space-id <CONTENTFUL_SPACE_ID> import --content-file contentful-data.jsonCheckout Rohit's
-
Start developing.
Navigate into your new site’s directory and start it up.
cd blakegreen-dev npm install gatsby develop -
Setup your Own Configure Projects.
Enter your own key
- spaceId: Key
- accessToken: Key
-
Open the source code and start editing!
Your site is now running at
http://localhost:8000!Note: You'll also see a second link:
http://localhost:8000/___graphql. This is a tool you can use to experiment with querying your data. Learn more about using this tool in the Gatsby tutorial.Open the
rg-portfoliodirectory in your code editor of choice and editsrc/pages/index.js. Save your changes and the browser will update in real time!
Looking for more guidance? Full documentation for Gatsby lives on the website. Here are some places to start:
-
For most developers, we recommend starting with our in-depth tutorial for creating a site with Gatsby. It starts with zero assumptions about your level of ability and walks through every step of the process.
-
To dive straight into code samples, head to our documentation. In particular, check out the Guides, API Reference, and Advanced Tutorials sections in the sidebar.