Skip to content

This project is a modern blog website built using Gatsby and React, with a focus on performance and styling flexibility. It uses styled-components for responsive and dynamic styling, providing a seamless design system without relying on external CSS frameworks like Bootstrap. The blog supports Markdown and MDX for easy content creation.

License

Notifications You must be signed in to change notification settings

itsyst/gatsby-blog

Repository files navigation

logo

Gatsby's Blog

This is my first attempt to build my ownn site with Gatsby.

🚀 Quick start

  1. Create a Gatsby site.

    I used the Gatsby CLI to create a my default starter site.

    gatsby new gatsby-blog
  2. Ready to go.

    I navigated into the new site directory and start it up.

    cd gatsby-blog/
    gatsby develop
  3. Create a new github-CLI repository

    # create a repository under github account using the current directory name
    gh repo create

This is my complete code for the Gatsby blog

Guide

  1. Clone or download the code from this repo

    # git clone git@github.com:itsyst/gatsby-blog.git
    gh repo create
  2. Install the dependencies

    cd gatsby-blog/
    npm install 

    or

    cd gatsby-blog/
    yarn install 
  3. 🚀Launch the project

   gatsby develop
  1. You can have a look to the deployed instance of this project

https://gatsbys-blog.netlify.app

🧐 What's inside?

A quick look at the top-level files and directories in this project.

.
├── node_modules
├── src
├── .gitignore
├── .prettierrc
├── gatsby-browser.js
├── gatsby-config.js
├── gatsby-node.js
├── gatsby-ssr.js
├── LICENSE
├── package-lock.json
├── package.json
└── README.md
  1. /node_modules: This directory contains all of the modules of code used by this project.

  2. /src: This directory will contain all of the code related to the front-end view of the site.

  3. .gitignore: This file tells git which files it should not track.

  4. .prettierrc: This is a configuration file for Prettier.

  5. gatsby-browser.js: This file is where Gatsby expects to find any usage of the Gatsby browser APIs.

  6. gatsby-config.js: This is the main configuration file for a Gatsby site.(config docs).

  7. gatsby-node.js: This file is where Gatsby expects to find any usage of the Gatsby Node APIs.

  8. gatsby-ssr.js: This file is where Gatsby expects to find any usage of the Gatsby server-side rendering APIs.

  9. LICENSE: This is a Gatsby starter licensed under the 0BSD license. but i replaced it with my own license.

  10. package-lock.json . This is an automatically generated file based on the exact versions of npm dependencies that were installed for this project.

  11. package.json: A manifest file for Node.js projects.

  12. README.md: A text file containing useful reference information about this project.

About

This project is a modern blog website built using Gatsby and React, with a focus on performance and styling flexibility. It uses styled-components for responsive and dynamic styling, providing a seamless design system without relying on external CSS frameworks like Bootstrap. The blog supports Markdown and MDX for easy content creation.

Topics

Resources

License

Stars

Watchers

Forks

Packages

No packages published