My blog

Hi! I'm Paul. Welcome to my blog! This is made by Gatsby.js and I have several experience in front-end development. Feel free for contact me in Linkedin, Email or Github.

⛏️ Tools

• Gatsby.js 2.3.31
• React.js 16.8.6
• Style-components 4.2.0
• typography 0.16.19

🏗️ Structure

What's inside in my blog project and src directory structure

.
├── components
├── images
├── pages
├── templates
└── utils

1. /components: components directory, splitting into four components as blog, home, portfolio and resume

2. /images: put images which used in the website

3. /pages: used for routes and my blog posts pages

4. /templates: blog posts and tags templates

5. /utils: Third party utils

🧱 Components

• blog

1. index
2. tag: tags style components

• home

1. index

• portfolio

1. index

• resume

1. common: common style components in each block as info, timeblock and list
2. educationBlock:
3. employmentBlock
4. index
5. personInfo
6. projectBlock
7. skillBlock
8. summaryBlock

🚀 Quick start

1. Create a Gatsby site.

   Use the Gatsby CLI to create a new site, specifying the default starter.

   # create a new Gatsby site using the default starter
   gatsby new my-default-starter https://github.com/gatsbyjs/gatsby-starter-default

2. Start developing.

   Navigate into your new site’s directory and start it up.

   cd my-default-starter/
   gatsby develop

3. 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 my-default-starter directory in your code editor of choice and edit src/pages/index.js. Save your changes and the browser will update in real time!

💫 Deploy