Time to put what we've learned to some practical use! The following lab provides the opportunity to create your personal portfolio webpage.
- DO NOT fork and clone this lab
- On your personal Github, create a new repo (you can name this however you'de like).
- After creating your repo and files, start coding. Be sure to meet the requirements listed below. You got this!
- After completeing (or even before), deploy your portfolio to GitHub Pages. Please refer to the documentation on GitHub for detailed instructions!
- Separation of concerns: HTML is strictly for content, CSS is strictly for style.
- Your CSS and HTML should be in separate files.
- Your HTML should pass the W3 HTML validator).
- Your CSS should pass the W3 CSS validator).
- No JavaScript required!
- Uses a CSS Media Query to have two different layouts for small and large screens (aka responsive design)
- Deployed to GitHub pages. This is a free hosting service provided by GitHub. You should name your repository
your-username.github.io. The result is that your page will be publicly available at http://your-username.github.io.
You have not been taught how to deploy to Github Pages. That's okay! This is an opportunity to learn something new on your own. Just follow the instructions here. If you run into any issues, just ask for help.
Every student must create their own website, but you're welcome and encouraged to collaborate with others! The best way to create a great website is to get targeted feedback from others at several points in the process.
-
You have a lot of autonomy with this project. Make something simple.
-
Think about who you want to view your site (potential employers, freelance opportunities, friends). Make it EASY for your visitors to access the information they want and navigate around the page
-
Think about the goal for your site and what you want your users to do (read about your story, look at your work/code/writing, contact you). Guide them to taking those actions by making them prominent / easy to find.
-
Wireframe what you want your site to look like first!
-
Use proper indentation and organize your code. Chances are people will view your source!
-
The website only needs to be one HTML page.
Personal websites from some previous SEB grads:
- http://bnmrrs.com/
- http://raleighdaniel.com/
- http://jlappano.github.io/
- http://kevoncheung.com/
- http://www.larrybuch.com/
- http://adrianbautista.com/
- http://www.andrewmadden.com/
- http://www.belcortes.com/
You can also search "developer portfolio website" for more ideas :)
- Explore CSS animations
- Try using some JavaScript
- Buy and configure a custom domain name
This lab is a deliverable.
Please create an issue on this repo, containing a link to the repo you created and the webpage that you deployed to Github Pages.