Do something cool, neat, and rad with code.
Do it during November 2020.
Code your own dope website.
- Open this project in CodeSandbox
- Sign in to CodeSandbox (with either Google or GitHub)
- Fork this project (by clicking the Fork button at the top right)
- Open the
index.htmlfile in the sandbox's code editor. (It should already be open for you.) - Replace "Codevember 2020" on line 60 with your name
- Example:
<h1>Heat Wave Dave</h1> - Once you've finished typing, the browser preview window on the right should automatically reload and show your name
- Example:
- Congratulations! You've just started coding! Keep changing things and seeing what happens. (You can begin simply by changing all code in this boilerplate that looks like
__TITLE__or__AUTHOR__inindex.htmlandsite.webmanifestto whatever you'd like.) - Think of something cool to build, and start Googling how to do it in HTML, CSS, and JS. (Googling how to do stuff is 90% of what most web developers do on a regular basis. You're virtually a web dev now!)
- Join the Friends Worldwide Slack group to get help, discuss ideas, or just have a good time.
- Once you've built your dope website, you're gonna wanna share it! Add your project to the list of Codevember 2020 projects
- Check out everyone else's projects
If you check out the code, you'll notice a lot of stuff that looks like __THIS__. Anything you see in that format is intended to be replaced. Do a "find and replace" with your text editor and change out the following things in each file:
| what to change | example |
|---|---|
__TITLE__ |
"My Portfolio" |
__DESCRIPTION__ |
"The portfolio of George Washington." |
__KEYWORDS__ |
"portfolio, george, washington" |
__AUTHOR__ |
"George Washington" |
example.com |
georgewashington.com |
#1d201f |
#42A5F5 |
| what to change | example |
|---|---|
__TITLE__ |
George Washington |
__SHORTNAME__ |
George |
#000000 |
#f8f8f8 |
#000000 |
#42A5F5 |
Change the tile color from #1d201f to your theme color (ex: #42A5F5).
There are a lot of images in this folder that you'll want to replace with your own. Make sure you replace each with an image of the corresponding size and type. I used the real favicon generator to create most these images, and it's the easiest way for you to do the same!
You can either delete index.js and sound.mp3 or play around with them.
Get funky!