Coder Social home page Coder Social logo

Build A Portfolio Website

With all of the projects you will be working on here at Lambda School, you will need somewhere to house them! There is no better opportunity to learn and show off your skills than a beautiful portfolio website.

You have the ability to write HTML, CSS, and responsive media queries. You also know how to identify and write responsive units. It's time to put that knowledge into action by reading someone else's code and adding your own flavor. You will be building a portfolio website from a template found on https://html5up.net/.

Project Set Up

Follow these steps to set up and work on your project:

_ Watch this walk through video: https://youtu.be/P2Y9W29kcjs

  • Create a forked copy of this project.
  • Add PM as collaborator on Github.
  • Clone your OWN version of the repository (Not Lambda's by mistake!).
  • Create a new branch on the clone: git checkout -b <firstName-lastName>.
  • Implement the project on the <firstName-lastName> branch, committing changes regularly.
  • Push commits: git push origin <firstName-lastName>.

Follow these steps to download your template and start the project:

Follow these steps for completing your project after your MVP is completed:

  • Submit a Pull-Request to merge <firstName-lastName> Branch into master (student's Repo). Please don't merge your own pull request
  • Add your Project Manager as a Reviewer on the Pull-request
  • PM then will count the HW as done by merging the branch back into master.

MVP Requirements

  • Study the code base and identify both responsive units and where media queries were used. Take notes on anything that confuses you or interesting things you find. Share this information in your standup meeting with your group
  • Customize the template to you
    • Update the title tag match your name
    • Update the place holder content throughout the template to your information
      • Some templates are much larger than others, you don't need to fill in every little div with information, just try to get the site representing you and your work
      • You can use sites like https://www.pexels.com/ for free images to fill in place holders
      • Showcase projects you have worked on by providing some information and links to your git hub projects
  • Implement proper attribution: Attribution is required under the creative commons license that came with the website files you downloaded. Be sure to provide attribution somewhere in the site. The templates should already come with attribution found in most footers but double check to be sure.
  • Host your website for the world to see. Follow the instructions found here https://pages.github.com/. Once you have hosted your web page, share it for your peers to see. This is not a small feat!

Stretch

  • Study the JavaScript used in your template and see if you can tweak any of the behavior to see how it works
  • Download another template and see if you can get the CSS preprocessor working on the project

Andrew Allen's Projects

algorithms icon algorithms

An introduction to algorithmic problem-solving and algorithmic paradigms.

git-for-web-development-project icon git-for-web-development-project

In this project you will be using the concepts learned in the Git for Web Development lesson to fork/clone/push/and submit a PR for each project during this sprint.

graphs icon graphs

Graphs, BFS, DFS, connected components

hospital icon hospital

Management of hospital supplies, workers, etc.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.