Fitness That Fits is a web site for people looking to adopt a healthier lifestyle. The idea behind the site is to help users make small but permanent changes which they can fit into their schedules rather than quick fixes which might lead to temporary changes but which will be abandoned later. The typical user is assumed to be an individual in average physical condition.
Fitness That Fits is the fourth milestone project for Code Institute's Full Stack Frameworks module. The goal of the project is to incorporate an authentication process, purchasing capability, exercise plans, and user profiles. The site is designed to address the following user stories:
- As a user, I would like to be able to look for fitness gear I can use at home.
- As a user, I would like to be able to purchase fitness gear.
- As a user, I would like to be able to select the quantity of the items I am purchasing.
- As a user, I would like to be able to search for products, workout plans, and habits on the site.
- As a user, I would like to be able to find different exercise plans.
- As a user, I would like to be able to make healthy changes in my life that I will stick with.
- As a user, I would like to be able to search for items on the site.
- As an administrative user on the site I would like to be able to add, delete, and edit products
on the site as well as habits and workout plans.
- As an administrative user on the site I would like to be able to change images.
- As a user, I would like to be able to register on the site
- As a user, I would like to be able to review my order history.
- As a user, I would like to be able to place an order with or without creating a profile.
- As a user, I would like to receive an email confirmation if I place an order.
- As a user, I would like to receive an email confirmation if I register on the site.
- As a user, I would like to be able to add items to my shopping bag.
- As a user, I would like to be able to read more about the details of specific products,
exercise plans, and healthy habits.
The site has the following features:
- A homepage which allows users to see an overview of the site
- Links to social media sites
- A page listing all of the products for sale
- Individual pages for seeing the details of the specific products and purchasing them.
- A page listing all of the exercise plans
- Individual pages for each of the exercise plans
- A page with an overview of healthy habits
- Individual pages with more information about healthy habits
- A page for the user profile
- A page to update products, habits and workout plans on the site
- A page for adding new products to the site
- A search function for both names and descriptions
The site is styled with Bootstrap and CSS and it uses Django and Python for most of the functionalities such as registering on the site, sending emails, adding items, adding CRUD functionality to the site, and searching. JavaScript was used for interactivity such as the toast pop-ups and the Stripe checkout functionality. Json was used for the data files.
Future improvements to the site would include adding a forum for users to communicate with other users, adding a way for users to enter their individual goals on the site and track their progress, adding a way for users to enter ratings of exercise plans and products, and adding the capability to add, update, and delete exercise plans for administrative users. For the exercise plans videos or images would also be added to demonstrate the exercises. Also, the appearance of the site would be improved with more consistent photographs and other visual improvements and auto-fill would be added to the search.
-
Django The project uses the Django framework to provide the major capabilities such as dictionaries, views, search, email, and authentication.
-
Stripe Stripe was used for the payment functionality.
-
Python Python was used for the backend functionality with Django.
-
Javascript Javascript was used for functionalities such as changing the quantity of items, toast pop-ups, and Stripe.
-
JQuery JQuery was used for interactivity on the site.
-
Json Json was used for the data for the fixtures.
-
Bootstrap Bootstrap was the framework used.
-
HTML HTML was used for the structure of the web pages.
-
CSS CSS was used for styling the web pages.
-
Heroku Heroku was used to deploy the web site.
-
Whitenoise Whitenoise was used (instead of AWS) for the static files.
-
Github Github was used for version control.
-
Gitpod Gitpod was used for the development environment.
-
Balsamiq The wireframe was created on Balsamiq.
Most of the code came from the boutique ado project. Code to make the hyperlinks black was found on W3 schools and code for the search function was from the boutique ado project, Stack Overflow (https://stackoverflow.com/questions/55468722/django-chain-list-objects-filter), and Coding for Entrepreneurs (https://www.codingforentrepreneurs.com/blog/a-multiple-model-django-search-engine).
The site was tested on a laptop and mobile phone and the links were checked and the purchasing functionality was tested. The site was also viewed in the following browsers:
- Google Chrome
- Safari
- Microsoft Edge
In addition, the checkout and registration functions were tested with invalid information (too many characters or the wrong type of data, such as numbers instead of characters or vice versa). The email function was also tested for both registering and placing an order. The ability to add, delete, and edit products was also tested on the site.
The site was deployed on Heroku with a pipeline created to the Git repository so that commits to Git are automatically added to Heroku. Whitenoise was used for the static files.
The photos are from Pixabay link to Pixabay and Shutterstock link to Shutterstock ,Unsplash link to Unsplash, and Pexels link to Pexels:
https://www.shutterstock.com/image-photo/smiling-group-diverse-friends-standing-gym-788222044
https://www.pexels.com/photo/focused-aged-man-doing-exercise-with-strap-elastic-5067749/
https://pixabay.com/photos/physiotherapy-weight-training-595529/
https://pixabay.com/photos/plank-fitness-muscular-exercising-1327256/
http://shutterstock.puzzlepix.hu/kep/1660419688
https://unsplash.com/photos/lrQPTQs7nQQ
https://unsplash.com/photos/H1COmZ4LULc
https://www.shutterstock.com/image-photo/training-home-sporty-man-doing-yoga-1700797540
https://www.shutterstock.com/image-photo/asian-male-doing-exercise-home-stay-1766378603
The inspiration for the site came from the following article: (https://www.theactivetimes.com/healthy-living/small-new-years-resolutions/slide-9).
Thank you to the tutors and my mentor Aaron for all their help and patience and sorry I was so slow. The inspiration was from various articles on behavioral research in weight loss and the structure and the majority of the source code came from the Boutique Ado project.