Frontend Milestone Project
This project is my first Milestone project to describe a 1960s band that want an internet presence displaying all their events from pictures, videos and audios. The website has also taken into consideration events, blogs and a contact us system so they can be booked for events. I have also included links to their social platforms
UX
I used Balsamic to create a wireframe of what the evntual site will look like and in addition; it is for a 1960s band that want an internet presence displaying all their events from pictures, videos and audios. The website has also taken into consideration events, blogs and a contact us system so they can be booked for events. I have also included links to their social platforms
The user story includes - viewing the website
links and access to profiles of band members
listening to recorded audio content
watching past video contents
viewing pictures of the band at events
booking the band for events
reading their blog stories
A wireframe image can be found at assets/images/FE Milestone Project.png
Features
The features were initially based around the mini project as my first entry into creating modern website. This gave be some leverage as to where to start from. Implemented features were based mainly around HTML, CSS using frmaeworks from W3School such as Bootstrap, FontAwesome, creating mp3 audio and mp4 videos. Future enhancements will see the addition of javasript and backend databases.
This will help me develop features like
Booking using the contact us form
Contact Us
Timeline Events
Picture page
Video page
Music page for their audio files
Contact form: At this time, the contact us page is just a plain form filed page which shows the potential for interracting with a backend system. I have only used the knowledge gained to get me to this point of of my study so far. With future lessons, I may go back and enable more advanced features.
Deployment
The development version has been done solely using Cloud9 IDE with integration into Github. The production version will be deployed using Github Pages. This will be achieved by going into settings for this particular repository, scrolling down to Github Pages and selecting the master branch where this repository resides. The website is hosted on github at https://obynz.github.io/fe-milestone-project/
The code itself can be run within Cloud 9 by selecting the correct html page and clicking the run button at the top of the page. A URL is displayed at the bottom of the page which displays the link to click to and get to the published development website.
Bugs
Due to time wasted on my part due to external work commitment and to save time; some bugs and errors found as a result of running this through jigsaw have been left unsolved. I hoping I get better at this as I progress.
Credits Bootstrap examples from https://www.w3schools.com/bootstrap4
Font Awesome Examples from https://www.w3schools.com/icons/fontawesome_icons_webapp.asp
Content Text area has not been a lot, but most were made up by myself
I took references for the following -
fontAwesome from -
https://www.w3schools.com/icons/fontawesome_icons_webapp.asp
Bootstraps
https://www.w3schools.com/bootstrap/bootstrap_ver.asp
How to create videos, audios etc.
https://www.w3schools.com/howto/default.asp
Media The photos used in this site were provided as part of the sample files by CodeInstitute. I have not added any additional content
Acknowledgements I received inspiration for this project from my Mentor - Victor