This is a static front-end website and it is designed to convey specific and helpful information in regards to surfing in Ireland. In particular, this website is to promote surfing in Ireland as an international tourist destination as well raise awareness to people in Ireland who maybe considering trying surfing. The website will provide information for the top 4 surfing locations along the atlantic coast of the West of Ireland. This will include locations of beaches, a frequently asked questions section, a gallery below the individual webpage.

This website is to promote and provide useful infomration for the surfing community based in Ireland. The website was designed with the user experience in mind. Breathtaking pictures were chosen to show the raw unfilterd beauty of the some of the best surfing beaches along the Atlantic way. More specifically, the website was targeted on millenials age group and lower. In this covid-19 era and current travel restrictions, people are waking up the great outdoors which has been on their doorstep. A wire frame mockup using Balsamiq was used to develope the intial site layout. If a person living in the Ireland was so inclined go for a drive and emerse themselves in nature through surfing. Based on their location, they have the locatiions and background information on 4 potential surfing locations. The color green was chosen to simulate seaweed.

Please see attached the mock for the MS1 wild atlantic surfing. Atmittedly, the project did change from the initial web design.

<>

In this section, you should go over the different parts of your project, and describe each in a sentence or so.

• Feature 1 - allows users X to achieve Y, by having them fill out Z
• ...

For some/all of your features, you may choose to reference the specific project files that implement them, although this is entirely optional.

In addition, you may also use this section to discuss plans for additional features to be implemented in the future:

• Create animation zoom in feature on the hero images for each webpage.
• Write over the hero images some useful information about the site.
• Align navigation bar to the right of screen.
• Possibly a google maps showing the locations of the beaches etc.

In this section, you should mention all of the languages, frameworks, libraries, and any other tools that you have used to construct this project. For each, provide its name, a link to its official site and a short sentence of why it was used.

• JQuery
  • The project uses JQuery fancybox to showcase photographs on the 4 web pages.
• Bootstrap
  • The project used Bootstrap navbar in the header section to faciliate site navigation throughout the site. The use of Bootstrap grids were also extensively used in addition to the HTML/HTML5 to create the site structure mainly with paragraphs. The use of Bootstrap buttons were also used to link between the home page and the other web pages as "Read More" option. The use of the Bootstrap dropdown accordion feature was used to create a frequently asked questions section. Also a copywrite section was created below the footer using Bootsrap.
• GoogleFonts
  • The use of Googlefonts was used to import Oswald text into the css file to used as a custom text on the website.
• Font Awesome
  • The use of FontAwesome was used as a library to import social media icon for Twitter, Facebook, YouTube and Instagram. These icons were imported and could be used as hyperlinks to these websites.

Testting was conducted throughtout the project. In order to ensure that the code that was being written was correct from the section of the project, the code was displayed in a new tab. This allowed to continual checking the desired structure of the varous webpages were created as intended. The Gitpod has an inbuilt checking mechanism for completing missing tags on various elements. Similarly, the css was constantly checked by using the checking tool within Gitpod and monitoring the outputs on the front end. The links for each webpage, including the navbars for each page and the social media links, the read more buttons, the frequently asked questions were checked and rechecked to ensure that it was working properly.

The f12 tools interface provided an instant checking opportunity for encountered quality issues on the project. This allowed the underlying issues to be narrowed downs and then they could be resolved. In addtion, the website responsiveness could be viewed on multiple platforms. The mobile first design philosophy was followed in this project. The webpage was tested on multiple gadgets such as smart phones, tablets and laptops. The website was also viewed on multiple browsers such Chrome and safari for e.g.The Css and html code was also analysed by the W3 validator for review.

This static website was developed on Githpod and hosted and deployed on Github.

In order to depoly the following steps were taken;

• 1. Setup a github repository account
• 2. Use a terminal git client
• 3. Clone the repository. Go to the folder where you want to store your project, and clone the new repository
• 4. Enter the project folder and add an index.html file
• 5. Add, commit, and push your changes to the git push origin master
• 6. Provided the files are up to date. Go to github repository --> select settings --> Github Pages --> generate link
• 7. Once that link is generated, click on it and the website should open on a browser. The website has been deployed through github pages.

Please find below a link to the mile stone project website "Wild Atlantic Surfing".

<< https://jaihsun.github.io/Wild-Atlantic-Surfing/>>

• The text for section Y was copied from the Wikipedia article Z https://extra.ie/2020/07/24/sponsored/wild-atlantic-way-surf-spots https://irishminibreaks.ie/surf-the-west-coast.html https://discoverbundoran.com/surfing/ https://outsider.ie/ireland/hidden-surf-spots-ireland/

• The photos used in this site were obtained from ...

#hero image (https://www.irishcentral.com/travel/best-of-ireland/australian-makes-stunning-video-about-surfing-in-ireland link)

https://extra.ie/2020/07/24/sponsored/wild-atlantic-way-surf-spots https://fontawesome.com/v4.7.0/icon/facebook-official https://www.discoverireland.ie/wild-atlantic-way/things-to-do https://wildatlanticsurfboards.com/ https://lookwest.ie https://www.georgekarbusphotography.com/portfolio/riding-giants/ https://www/clareecho.ie https://sleepzone.ie https://independent.ie https://kilmallockcu.ie https://pintrest.com https://irishtimes.com https://discoverbundoran.com https://www.codecademy.com/articles/f1-u3-github-pages https://www.w3schools.com/ https://pages.github.com/