Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/bchiang7/v4

Fourth iteration of my personal website built with Gatsby
https://github.com/bchiang7/v4

gatsbyjs personal-site styled-components

Last synced: 10 days ago
JSON representation

Fourth iteration of my personal website built with Gatsby

Host: GitHub
URL: https://github.com/bchiang7/v4
Owner: bchiang7
License: mit
Created: 2018-08-16T02:33:48.000Z (about 6 years ago)
Default Branch: main
Last Pushed: 2024-07-28T23:42:36.000Z (3 months ago)
Last Synced: 2024-10-11T13:20:12.474Z (28 days ago)
Topics: gatsbyjs, personal-site, styled-components
Language: JavaScript
Homepage: https://v4.brittanychiang.com/
Size: 50.5 MB
Stars: 7,528
Watchers: 73
Forks: 3,728
Open Issues: 41
Metadata Files:
- Readme: README.md
- License: LICENSE

Awesome Lists containing this project

README

        


  





  brittanychiang.com - v4





  The fourth iteration of brittanychiang.com built with Gatsby and hosted with Netlify





  Previous iterations:

  v1,

  v2,

  v3





  

    

  



![demo](https://raw.githubusercontent.com/bchiang7/v4/main/src/images/demo.png)

## 🚨 Forking this repo (please read!)

Many people have contacted me asking me if they can use this code for their own website, and the answer to that question is usually **yes, with attribution**.

I value keeping my site open source, but as you all know, _**plagiarism is bad**_. It's always disheartening whenever I find that someone has copied my site without giving me credit. I spent a non-trivial amount of effort building and designing this iteration of my website, and I am proud of it! All I ask of you all is to not claim this effort as your own.

Please also note that I did not build this site with the intention of it being a starter theme, so if you have questions about implementation, please refer to the [Gatsby docs](https://www.gatsbyjs.org/docs/).

### TL;DR

Yes, you can fork this repo. Please give me proper credit by linking back to [brittanychiang.com](https://brittanychiang.com). Thanks!

## 🛠 Installation & Set Up

1. Install the Gatsby CLI

   ```sh

   npm install -g gatsby-cli

   ```

2. Install and use the correct version of Node using [NVM](https://github.com/nvm-sh/nvm)

   ```sh

   nvm install

   ```

3. Install dependencies

   ```sh

   yarn

   ```

4. Start the development server

   ```sh

   npm start

   ```

## 🚀 Building and Running for Production

1. Generate a full static production build

   ```sh

   npm run build

   ```

1. Preview the site as it will appear once deployed

   ```sh

   npm run serve

   ```

## 🎨 Color Reference

| Color          | Hex                                                                |

| -------------- | ------------------------------------------------------------------ |

| Navy           | ![#0a192f](https://via.placeholder.com/10/0a192f?text=+) `#0a192f` |

| Light Navy     | ![#112240](https://via.placeholder.com/10/0a192f?text=+) `#112240` |

| Lightest Navy  | ![#233554](https://via.placeholder.com/10/303C55?text=+) `#233554` |

| Slate          | ![#8892b0](https://via.placeholder.com/10/8892b0?text=+) `#8892b0` |

| Light Slate    | ![#a8b2d1](https://via.placeholder.com/10/a8b2d1?text=+) `#a8b2d1` |

| Lightest Slate | ![#ccd6f6](https://via.placeholder.com/10/ccd6f6?text=+) `#ccd6f6` |

| White          | ![#e6f1ff](https://via.placeholder.com/10/e6f1ff?text=+) `#e6f1ff` |

| Green          | ![#64ffda](https://via.placeholder.com/10/64ffda?text=+) `#64ffda` |