A fitness subscription application where a user sign up, view and comment on videocontent and upload there own videos.
It showcases my ability to use the Python Django Framework, implementing CRUD Funtionality, Amazon Web Services and Stripe payments.
The deployed web application can be found here.
- 1. Introduction
- 2. How to use
- 3. Frameworks and Technologies
- 4. Testing
- 5. Bugs
- 6. Future Updates
- 7. Contribution Links
- 8. Deployment
- 9. Wireframes
- 9. E-commerce business model
This is my final project portfolio required in the Full-Stack Software Development Diploma I am currently undertaking. It demonstrates the core skills and learnings I've taken from my experience throughtout the course. it's a subscription service using the Django Framework Django which is a Python-based free and open-source web framework, it follows the model–template–views architectural pattern and incoparates Stripe Payments.
The aim of the project to create a Fitness video sharing application.
The website will allow the user to register and make a recurring monthly payment via stripe payments and access the video content.
The user will be able to watch and comment on all video content.
The user will be able to upload and share there own video content.
The user will be able to cancel there subscription at any time.
Workout videos can help you reach your clients much more efficiently and give them the information they need. With one video conducting a workout, you will be able to share that with all of your clients and not need to instruct each individual client.
Trainers and coaches have the hardest time setting themselves apart from their competition. Creating workout videos to post to social media and other platforms is a very effective way of exemplifying your coaching ability to potential clients. This also establishes credibility with them right off the bat showing them that you know exactly what you’re talking about. Therefore, you will already have an advantage over your competition.
Video clips hold a great deal of value as you stock up on them. Often, when creating new videos, its time consuming to start from scratch. As you create more workout video content, you can reference them in new videos and piece together elements from others.
By creating workout videos, you can reach more clients, more often with the time you save on repeated instruction. Your time as a trainer is extremely valuable. Any way that you can save time creates more opportunity for you to reach new clients or spend more time with others who need it.
When the user first opens the web application they will be able to view:
- The landing page
- The content pages
- The login page
- The register page
- Stripe payment page
The user will need to sign up and pay a monthly subscription to view:
- The detail-video page
- The create-video page
- The user profile page
- The logout page
The following walkthrough with images shows the web application functionality:
When the user first opens the web application they are greeted with a landing image and a navbar.
The landing page asks the user to browse the video content and also to sign up today.
The navbar allows the user to browse the video content and also to sign up if they wish.
The footer has links to social media pages.
The content page allows the user to browse the content, this page includes important info about the content such as:
- Video Name
- A description of the video
- Who uploaded the video
- When was the video uploaded
If the user click on one of the video cards they will be asked to sign up
The Sign Up page is a form that requests the following details:
- E-mail address
- username
- name
- location
- Image
- Password
- Password confirmation
Once the user provides these details, they will be asked to pay and subscribe via STripe payments
The login page is a form that requests the following details:
- Username or E-mail address
- Password
Onces the user provides these details, they can then access the web application.
If the user accesses the login page that has not already registered there is a link to the sign up page.
Once the user sumbits there sign details, they are asked to pay and subscribe which brings them to stripe payments page:
On the stripe page the user has the ability to pay a recurring monthly fee of 15 euro to view the video content or cancel where the user will be directed back to the homepage
When the user logs in to the web application they are greeted with a landing image and a navbar.
The landing page asks the user to browse the video content.
The navbar allows the user to browse the video content and also to view there profile.
The footer has links to social media pages.
The detail video page is where the user can watch the video content.
This pages details the when the video was uploaded and gives a description of what video.
there is also a similar videos section when shows additional videos that are in this category.
There is also a leave a comment section where the user can post a comment and view other users comments.
Please note that foe this project all videos are the same, the video used is for demonstration purposes only.
The create video page allows the user upload their own video content.
The following details is required by the user to successfully upload a video:
- Title
- Description
- Video file (mp4)
- Thumbnail (png, jpeg, jpg)
- Category
When the user inputs there sign up details, this information is also used to create a profile for the user.
The user profile page consists of the user information details.
The user profile page gives the user the ability to edit their profile, upload video content.
The user profile page gives the user the ability to sign up the Kevs Fitness World newsletter and to unsubscribe
The user profile page allows the user to cancel their subscription if they wish.
When the user uploads a video, they can also be accessed from this page for quick access if the user wishes to edit or delete.
The logout page allows the user to logout.
This web application was created using the Django Framework.
Django is a Python-based free and open-source web application framework for the backend development of web applications and websites.
It follows the Model View Template (MVT) architectural pattern. It separates the code into three distinct parts – Model, View and Templates. The developers just have to code what should be displayed to the user and Django will take care of all the background details.
It is maintained by the Django Software Foundation, the primary goal of Django is to ease the creation of complex, database-driven websites.
The Python web framework Django emphasizes the following core areas:
- Reusability
- Pluggability of components
- Less code
- Low coupling
- Rapid development
Django Allauth is an integrated set of Django applications addressing authentication, registration, account management as well as 3rd party (social) account authentication.
- It supports multiple authentication schemes (e.g. login by user name, or by e-mail), as well as multiple strategies for account verification (ranging from none to e-mail verification).
- All access tokens are consistently stored so that you can publish wall updates etc.
Sripe allows the product owner to accept payments from customers around the world in minutes. The Stripe platform is designed to increase conversion at every step of the payment flow – from optimised checkout flows and fraud prevention to issuer-level optimisations.
Stripe’s hosted payments page provides an optimised checkout experience for customers. It reduces friction, supports relevant global payment methods, and adapts to your customer's language and device.
We can also build a fully customised experience and simplify PCI compliance using our flexible integration options.
By optimising the design of the checkout page alone, e-commerce businesses increased conversion by an average of 35%. Stripe recently analysed payment forms of the top 100 e-commerce stores in the UK to identify important tactics for optimising checkout.
AWS (Amazon Web Services) is a comprehensive, evolving cloud computing platform provided by Amazon that includes a mixture of infrastructure as a service (IaaS), platform as a service (PaaS) and packaged software as a service (SaaS) offerings. AWS services can offer an organization tools such as compute power, database storage and content delivery services.
AWS launched in 2006 from the internal infrastructure that Amazon.com built to handle its online retail operations. AWS was one of the first companies to introduce a pay-as-you-go cloud computing model that scales to provide users with compute, storage or throughput as needed.
AWS offers many different tools and solutions for enterprises and software developers that can be used in data centers in up to 190 countries. Groups such as government agencies, education institutions, nonprofits and private organizations can use AWS services.
Google Developer Tools is used test bug fixes on the fly.
Google Developer Tools was really important when making the website responsive.
The website application is responsive on the follwoing devices:
- Widescreen desktop.
- Laptop.
- Ipad.
- Mobile Phone (iPhone SE).
I used W3C Markup Validator to check for any errors within my HTML pages.
I used W3C CSS Validator to check for any errors within my CSS page.
I used the PEP8 online validator to check my python code for errors.
- When “Kevs Fitness World” is left clicked with the mouse, the browser sends the user to the Landing page. It worked as expected.
- When “Browse All Content” is left clicked with the mouse, the browser sends the user to the all content page. It worked as expected.
- When any tab in the “Workout dropdown” is left clicked with the mouse, the browser sends the user to that category content page. It worked as expected.
- When “Sign Up” is left clicked with the mouse, the browser sends the user to the Sign Up page. It worked as expected.
- When “Login” is left clicked with the mouse, the browser sends the user to the Login page. It worked as expected.
- When “Check Out Our Classes” is left clicked with the mouse, the browser sends the user to the all content page. It worked as expected.
- When “Sign Up Today ” is left clicked with the mouse, the browser sends the user to the Sign Up page. It worked as expected.
- When the “You Tube Icon” is left clicked with the mouse, the browser sends the user to the You Tube page. It worked as expected.
- When the “Facebook Icon” is left clicked with the mouse, the browser sends the user to the Kevs Fitness World Facebook page. It worked as expected.
- When “Instagram Icon” is left clicked with the mouse, the browser sends the user to the Instagram page. It worked as expected.
- When “Instagram Icon” is left clicked with the mouse, the browser sends the user to the Instagram page. It worked as expected.
- When a video card is left clicked with the mouse, the browser sends the user to the please sign up or login page. It worked as expected.
- When a video card is left clicked with the mouse, the browser sends the user to the video detail page. It worked as expected.
- When the play video button is left clicked with the mouse, the video plays. It worked as expected.
- When any of the similar videos is left clicked with the mouse, the user is directed to that video detail page. It worked as expected.
- When the user writes a comment and left click onthe post button, the comment is posted on the video detail page. It worked as expected
- When “Edit Profile” is left clicked with the mouse, the browser sends the user to the update profile page. It worked as expected.
- When “Upload a Video” is left clicked with the mouse, the browser sends the user to the update create video page. It worked as expected.
- When “Sign up to Kevs Fitness World Newsletter” is left clicked with the mouse, the browser sends the user to the Newsletter Sign Up page. It worked as expected.
- When “Unsubscribe to Kevs Fitness World Newsletter” is left clicked with the mouse, the browser sends the user to the Newsletter Unsubscribe page. It worked as expected.
- When “Cancel Kevs Fitness World Subscription” is left clicked with the mouse, the subscription to Kevs Fitness World is canceled and the user is directed to the homepage. It worked as expected.
- The user can update the following profile attributes:
- Name
- Location
- Image
It worked as expected.
- The user can upload a video by submitting the following details:
- Title
- Description
- Video file (mp4)
- Thumbnail (png, jpeg, jpg)
- Category
It worked as expected.
- When “Pay and Subscribe” is left clicked with the mouse, the user is directed to the Stripe payments page. It worked as expected.
- When “Cancel” is left clicked with the mouse, the browser sends the user to the cancel page. It worked as expected.
- when a user enters there credit card details and submits a recurring payment, and the payment is successful, the user is directed to the success page. It worked as expected.
- On the success page when "Continue to site" is left clicked the user is directed to the homepage. It worked as expected.
- When I deployed my project to heroku, I setup an amazon web services account to store my media and ststic files.
Once setup the the static files were rendering on my application as expected but the media file were not.
- Fix: I was using the wrong src directory, once updated with {{ MEDIA _URL }} the issue was resolved.
- When deploying my project to Heroku I was receiving an application error stating "IP address mismatch" when trying to view the application.
- Fix: There was an error in my Procfile, once the Profile was updated, the issue was resolved.
- When Adding the stripe payment to my application during testing I kept receiving an error 500.
- Fix: There was an error in the domain url in the create_checkout_session view, once the create_checkout_session view was updated, the issue was resolved.
- Make the application more secure, there is period where the user has registered for the application but has not made their payment, if they cancel the payment and login into the application with the sign up details they submitted they will be able to use the application for free.
- Django
- Font Awesome Icons
- Bootstrap
- Heroku
- Postgresql
- Django-Allauth
- MDN Web Docs
- W3schools
- Google fonts
- Stack exchange
- Stack overflow
- W3C Markup validation
- W3C CSS validation
- Python Docs
- Python Tutor
- PEP8 online
- Amazon Web Services
- Stripe Payments
The following steps were used to to deploy this web application to Heroku and use Amazon Web Services to store the static and media files.
- Create a Heroku App
- Add a Heroku Postgres database via heroku resources
- Add your configuration variables and setup an env.py to store them gitpod
- Select Github as your deployment method and connect your github project to your Heroku app
- Deploy brench and and your application should to deploy to the world wide web.
- Once deployed create an amazon web services account.
- Using the amazon S3 service create a bucket and upload you meadia and static files.
- In your setting.py file in Github add "storages" to installed app.
- In your setting.py file in Github add your bucket configuration, cache control and your media and static urls.
Fitness is one of the most popular genres of subscription networks. And as online fitness becomes more popular, consumers are increasingly expecting virtual fitness or fitness subscription video on demand (SVOD) as an option.
And why wouldn’t they? The ease of at-home fitness and availability of classes on-demand makes committing to a subscription plan worth it. According to Global Market Insights, online fitness programs will grow by 30% through 2026.
- The staying power of digital-focused fitness
Working out from home has always been a popular exercise option. From Jane Fonda VHS tapes to Peloton bikes, digitally-focused at-home fitness had established a growing and viable market even before COVID-19 restricted access to gyms and fitness studios.
Many popular fitness studios with previously-developed fitness subscription networks grew their audience base exponentially over the course of 2020. But before the pandemic, Vimeo OTT fitness channels had already proved their worth — with 206 minutes of content watched each month on average and an 89% retention rate.
- Many options for monetization
There are many different ways to monetize your fitness videos online. From Instagram to pay-per-view to OTT channels, everyone from fitness influencers to franchised organizations can find ways to make money through online content.
- Your application, your content
This is an obvious pro. By creating your online fitness program or OTT channel, you have the power to make the content you feel is missing from the industry or the content that is an extension of you.
While a fitness subscription network takes time and equipment to get off the ground, it is much more scalable than a strictly brick-and-mortar business model.
Often, factors like time and location can stop a consumer from joining you for an in-person class. By moving your content online, you eliminate those barriers and bring the content straight to your audience.
Before I launch the online fitness program, I need to do market research to ensure that your target audience is out there. Through consistent uploads and outreach, I will reach more people and build relationships with my subscribers.
Making content that speaks to my audience will result in consistent conversions and return customers
A no-brainer. By beginning a fitness subscription business, I can achieve the type of growth that isn’t possible through only in-person options. Online classes have no size limits or time and location restrictions. Once I've developed and filmed the content, I can sit back and watch my business grow – that is, until I'm ready to film again.
To build and keep a subscription base, I have to produce quality content. From speaking to others in the business, the content has become the mainstay of there business. If a fitness subscription is a step I'm going to take, I have to focus on the content as my business’s meat and potatoes.
- Promote content, not my brand
When it comes to promoting my fitness subscription network, creative matters. Content ads generally convert customers 3-4x cheaper than brand ads. So it pays to show off the content I'm creating rather than the brand itself.
Using video for my promotions will also pay off. As a video business, it stands to reason that video converts better.
- Invest in community
Fitness doesn’t have to be an individual journey. I can bring my subscribers into something greater than simply taking a class by investing in the community. I plan on utilizing social media to create groups or a hashtag. Create a space in my newsletters for subscribers to share about their journey with the platform. This creates even more value around my brand and has been proven to increase overall customer lifetime value.
- Stay true to my brand
Maintaining that balance between innovation and staying true to my core offering is easier said than done. But staying true to your brand builds trust with the audience, so they know what they’re coming back to time and time again.
- Create new content consistently
Sellers with over 500 videos saw retention rates of 91% on average. That may seem like many videos now, but if I'm planning on going live frequently — those videos add up quickly. Consistent uploads are probably the #1 way to keep subscribers around.