Click here to view the live project

Sweet Spot is a website for a cake baking community where cake decorators and bakers share cake photos, cake decorating tips, and cake recipes.

The site brings together cake lovers to share in the love of cake decorating and help one another learn. Sweet Spot is a place to discuss and share baking recipes with people of similar interest.

• Navigation Bar

  • All the pages of the website are provided with a fully responsive navigation bar for easy navigation that contains links to the Logo, Home page, Gallery page and Join US page.
  • The navigation tells the user the name of the website and navigation to each sections of the website.
  • The navigation is provided with a font color that contrasts with the background for easy visibility.

• About Us section

  • This section describes what the website is for and a small description of the activities for the users.
  • The About Us section is displayed with the images of lovely cakes prepared by the baking community and the images are provided a hover effect.
  • This section also includes a button which on clicking is redirected to the "Join Us" page of the website and the users can sign up.

• Upcoming Events section

  • This section describes the events that happen for the baking community.
  • The upcoming events for the community are Meetings for the members, a dream space to share the recipes and discussions between members of the latest happenings.

• Footer section

  • The footer section allows the user to get connected with the Sweet Spot via social media.
  • The footer is provided with different links to the social media sites for Sweet Spot and each of these links opens to a new tab.

• Gallery Page

  • The gallery page includes many images of the Sweet Spot and it shows the users the various events that took place in the community.
  • The images in the gallery page are displayed in a grid view with a dark background.

• Join Us Page

  • The Join Us page allows the user to sign up to the application and join the Sweet Spot community.
  • The page has a form to collect the information of the user which included firstname, lastname, email and gender of the user and a submit button to submit the information entered.

• I confirmed that all the texts included are readable and the images are visible.
• I confirmed that all links provided are clickable and are redirected to a new page.
• I tested the sign up form and it works well with the submit action for the submit button.

• I tested the website on different browsers like Chrome, Edge and Firefox.

• I confirmed that the website is responsive and looks good on all standard screen sizes.

• HTML
  • No errors were returned when passing through the official W3C validator.

• CSS
  • No errors were found when passing through the official (Jigsaw) validator.

• Accessibility
  • I have checked the accessibility by running it through the lighthouse in devtools.

• When I tested my project, I noticed that the nav bar was not responsive and the images in the home page was not aligned properly.
• I fixed the issues using media queries.

The site was deployed to GitHub pages. The steps to deploy are as follows:

• In the GitHub repository, navigate to the Settings tab
• From the source section drop-down menu, select the Main Branch, then click "Save".
• The page will be automatically refreshed with a detailed ribbon display to indicate the successful deployment.

The live link can be found here

In order to make a local copy of this project, you can clone it. In your IDE Terminal, type the following command to clone my repository:

• git clone https://github.com/Amrutha2103/sweet-spot.git

Alternatively, if using Gitpod, you can click below to create your own workspace using this repository.

• The icons in the webpage were taken from Font Awesome
• Instructions on how to implement header for all pages with a hover effect on navigation elements was taken from this tutorial
• The code to make the social media links was taken from the Love Running project

• All the images used were taken from this site istockphoto