The second iteration of adamalston.com built with React and hosted with Netlify.
Previous iteration: v1
This website's design is both simple and accessible. Dynamic particles create an experience that is interactive and visually inviting. The site offers two themes via a toggle, dark mode (default) and light mode. 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 :)