Visit me at shangsan.me
My personal website. Easily modifiable, and built using modern javascript with Node.js, React, Express, React-Router, Hot Module Reloading, Webpack and many other technologies.
Tested with:
- To download the repository and install dependencies, run the following commands:
git clone https://github.com/samantha/samantha.github.io.git
cd personal-site
yarn
If you do not have yarn
installed, you may run npm install
instead.
- Next, you should create a
.env
file. To do this, run:
cp sample.env .env
and set values as appropriate. Most people will not need to make changes.
- Run the following command to build the react application and serve it with hot module reloading:
npm run dev
Navigate to <ip>:<port>
default: http://localhost:7999 to view my website.
This completes set up instructions. Please continue reading to learn how to modify this site to make it your own.
-
Start by changing text in the sidebar. This file is located at
app/components/Template/Nav.js
. -
Add an image of yourself in
public/images/me_icon.jpg
. If you decide to change the filename, be sure to go back to the sidebar and change the image path there as well. -
Modify the text in
app/views/Index.js
-
Modify the files in
app/data/resume/
next. When you're finished, go back and modify all of the other files in theapp/data/
directory. -
You've finished modifying >95% of the pages. Search through the rest of the files for references to
Michael
orAngelo
and change values to your name. -
Change the description in
server/views/index.tpl.html
. You may also wish to add a new favicon or remove it. This website may be helpful. -
Decide how and where you are going to host this project. I recommend purchasing your own domain name from Google Domains. If you would like to host on github pages, run
npm run deploy
. This will generate a new branch calledgh-pages
. Then go tohttps://github.com/[your github username]/personal-site/settings
and configure accordingly: -
Configure your domains DNS record. See here for more information.
-
If using a custom url, modify the
CNAME
file to point to your URL. Modify the npm deploy script by appending&& cp CNAME dist/
to the end of thepredeploy
line in the scripts section of package.json. If you plan to deploy to a /[path] (e.g. http://samantha.github.io/personal-site/), you should modifyBASE_PATH
in your.env
andsample.env
files and restart the express server. Note that you will now have to navigate tolocalhost:[port]/[BASE_PATH]
when developing.
- Change
NODE_ENV
toproduction
in.env
- Run
npm run deploy
- @mldangelo
- @typpo
- Template based on Future Imperfect by @ajlkn for HTML5 UP.