Ecosyste.ms: Awesome

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

Awesome Lists | Featured Topics | Projects

https://github.com/nragland37/my-portfolio

Portfolio built with Gatsby, JavaScript, GraphQL, GSAP, and Styled Components
https://github.com/nragland37/my-portfolio

gatsby gatsbyjs graphql gsap gsap-animation personal-website portfolio react styled-components vercel

Last synced: 10 days ago
JSON representation

Portfolio built with Gatsby, JavaScript, GraphQL, GSAP, and Styled Components

Host: GitHub
URL: https://github.com/nragland37/my-portfolio
Owner: nragland37
License: mit
Created: 2024-10-03T03:24:06.000Z (3 months ago)
Default Branch: main
Last Pushed: 2024-12-07T19:21:17.000Z (17 days ago)
Last Synced: 2024-12-07T20:20:18.717Z (17 days ago)
Topics: gatsby, gatsbyjs, graphql, gsap, gsap-animation, personal-website, portfolio, react, styled-components, vercel
Language: JavaScript
Homepage: https://www.nicholasragland.com
Size: 183 MB
Stars: 3
Watchers: 1
Forks: 0
Open Issues: 0
Metadata Files:
- Readme: README.md
- License: LICENSE

Awesome Lists containing this project

README

        [![Codacy Badge](https://app.codacy.com/project/badge/Grade/6ad1d4af511a4c6b8944e8b681bab07f)](https://app.codacy.com/gh/nragland37/my-portfolio/dashboard?utm_source=gh&utm_medium=referral&utm_content=&utm_campaign=Badge_grade)

[![License](https://img.shields.io/badge/license-MIT-blue)](https://github.com/nragland37/my-portfolio/blob/main/LICENSE)



  

    nicholasragland.com

  





  Built with Gatsby.js and hosted with Vercel





  

![Vercel](https://vercelbadge.vercel.app/api/nragland37/my-portfolio)




  

  



> [!IMPORTANT]

> This project requires **Node.js version 18 or higher**: [Node.js official website](https://nodejs.org/)

## Getting Started

1. **Install the Gatsby CLI**

   ```sh

   npm install -g gatsby-cli # or yarn global add gatsby-cli, pnpm add --global gatsby-cli, bun add --global gatsby-cli

   ```

2. **Clone the repository**

   ```sh

   git clone https://github.com/nragland37/my-portfolio.git

   cd my-portfolio

   ```

3. **Install dependencies**

   ```sh

   npm install # or yarn, pnpm, bun

   ```

4. **Start the development server**

   ```sh

   npm start # or yarn start, pnpm start, bun start

   ```

   Open in browser: http://localhost:8000

## Deployment

To prepare your project for deployment:

1. **Build the project**

   ```sh

   npm run build # or yarn build, pnpm build, bun build

   ```

2. **Serve the production build**

   Test how the production build performs in a simulated server environment locally:

   ```sh

   npm run serve # or yarn serve, pnpm serve, bun serve

   ```

   Open in browser: http://localhost:9000




  

| Command        | Description                                                      |

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

| `npm start`    | Runs `gatsby develop`, starting the development server.          |

| `npm run build`| Compiles the project for production using `gatsby build`.        |

| `npm run serve`| Serves the built project using `gatsby serve`.                   |

| `npm run clean`| Clears Gatsby's .cache and public directories.                   |

| `npm run format`| Formats code using Prettier.                                    |

| `npm run check`| Checks if the code is formatted correctly without making changes.|




| Color             | Hex                                                                |

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

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

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

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

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

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

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

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

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

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

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

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

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

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




## Acknowledgement

Inspired by the portfolios of [Brittany Chiang](https://v4.brittanychiang.com/), [Adham Dannaway](https://www.adhamdannaway.com/), and [Charles Bruyerre](https://itssharl.ee/fr).