v2
v2 copied to clipboard
:test_tube: Personal website built using React!
adamalston.com ·

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.
Open Source
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
Icons
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 |
Color Reference
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 :)