The second iteration of adamalston.com built using React and hosted on Netlify.
Previous iteration: v1
I have designed this website to be simple and accessible. Dynamic particles create an experience that is interactive for visitors. The site offers two themes via a toggle, a dark theme (default) and a light theme. Once toggled, the selected theme should persist between tabs, windows, and page reloads.
Mobile support for the site ranges from 4 in. displays through 6.7 in. all the way up to 13 in. tablets.
I made this website open source under the assumption that others would use the code to create their own websites. I only ask that this code be used with attribution as a significant amount of time was spent writing and optimizing it. Please give proper credit by linking back to adamalston.com. Thanks!
Install & Setup
- Clone this repository
- Install dependencies:
npm install - Start the development server:
npm start
Build & Deploy
- Create a production build:
npm run build - The React Deployment docs detail how to deploy to
gh-pages, Netlify, and many other services
Font Awesome Icons
| Use | Icon | Short-Code |
|---|---|---|
| Dark Mode | far moon |
|
| Light Mode | far sun |
|
| GitHub | fab github |
|
fab linkedin |
||
| Resume | fal file-alt |
|
fal paper-plane |
Text and icons have a color contrast ratio greater than 7:1 satisfying WCAG 2.1 Section 1.4.6
| Name | Color | Hex |
|---|---|---|
| Black | 000000 |
|
| Slate | 333333 |
|
| Red | ff2600 |
|
| Orange | ff8000 |
|
| Yellow | ffd500 |
|
| Green | 22dd22 |
|
| Blue | 00bfff |
|
| Purple | c912ed |
|
| Silver | cccccc |
|
| White | ffffff |
If you found this project useful, please consider giving it a ! If you have any questions or feedback, open an issue and I will get back to you :)