Deployed website found here: https://dougdavidoff.github.io/. The website requires no installation steps from the user.
Here we present the initial stage of creating a professional-grade portfolio for our work in coding bootcamp. This will be a great assistance as we prepare for the job search following graduation from bootcamp. The portfolio makes extensive use of Bootstrap, including its built-in formatting and grid layout technologies.
Development of the website was greatly aided by coding samples found at the StartBootstrap and ReusableForms website. Specifically:
- The page layout and the navbar were assisted from this StartBootstrap site: https://startbootstrap.com/snippets/full-image-background/
- The sticky Bootstrap foooter was created using this StartBootstrap site: https://startbootstrap.com/snippets/sticky-footer-flexbox/
- The email contact form was adapted from ReusableForms at: http://reusableforms.com/d/e1/bootstrap-contact-form-send-email
- Please note: ReusableForms provided PHP code and more technology allowing the developer to upload a complete form-handling product to the host. After discussing this with teaching staff, I elected to present just the form absent the handling technology. Clicking on "send" actually does nothing. I would like to add form-handling the the site later on.
Project accomplishments:
- Appearance roughly matches examples supplied in the homework assignment.
- A functioning navigation bar is presented. It is consistent on all pages. The navbar supplies links to index.html -- which is the About page -- as well as to portfolio.html and contact.html.
- Bootstrap's grid system is used on portfolio.html and on contact.html. (NOTE: I did not use nesting rows in columns, which was a bonus challenge. Frankly, my layout did not offer an opportunity to make use of nesting rows in columns.)
- The three-page website is deployed.
- A README is supplied.
- All links work with one exception. As discussed above, the "send" link on the email form has not been enabled.
- Semantic HTML is employed.
- Appropriate personalized information is built into the site.
- Bootstrap components and grid system are used throughout the site.
- A sticky footer is used, stemming from Bootstrap. This is one of the two bonus challenges in the homework assignment.
- The website is responsive to different media/viewport sizes.
- The website's three HTML pages were checked at W3.org's code validator.
Project challenges Developing the website presented a number of challenges requiring help from the teaching staff and my tutor. Here is a list of challenges and their disposition:
- Responsive layout and responsive images. After research and further study at W3schools.com and FreeCodeCamp.org, I was able to work things out, more or less. This task included use of minimal media queries and presentation on the "xs" and "sm" screens. I learned that next time, I should begin coding in the mobile view and work to enlarge outwards.
- When presented with a hamburger logo, the navbar did not work. I was able to resolve this.
- I had to learn Markdown Language to format this README file.
Tests Pages in this website were tested at the W3C Markup Validation Service found at: https://validator.w3.org
License This is an open-source public site. Anyone may use it. If the user wishes to contact the developer (who would love to network about jobs), please use the contact.html form or telephone (203) 522-8533.