The site is a Golf store, were you can buy golf products, courses and also golf travels.
Overview
-
First time visitor goals
- Easy understand the websites structure and navigation.
- Understand the purpose of the website
- I want to be able to view specific product details
- I want to be easily able to purchase products
- i want it to be easy to set up an account
-
Returning visitor goals
- Easily be able to check if any courses,travel or accessoaries is availible.
- Login to the account that i have created before and see my purchases and information.
- Change my account details.
- I want to be able to view specific product details
- I want to be easily able to purchase products
-
Admin goals
- As Admin, I want to: Be able to create, read, update and delete products.
| As a/an | I want to be able to | So that I can |
|---|---|---|
| Shopper | View individual product details | Learn more about the products and se the price/ratings |
| Shopper | Content in the second column | Content in the second column |
| Shopper | View the chart/bag | To se that all items are in the chart and at the right quantity |
| Shopper | view the bags total price | To se the total spending |
| Shopper | Search for products or category | So i can find what im looking for |
| Shopper | Content in the second column | Content in the second column |
| Shopper | View a list of products | Select to purchase items |
| Site owner | Change/update product details | So the products details are correct and up to date |
| Site owner | Delete products | So i can delete products that are no longer for sale |
| Site owner | Add products | So i can scale the sales |
| Site owner | changing the websites content | So i can change images, structures of the site if needed. |
| Site user | Get a confirmation email after register | So i know that my registrations work. |
| Site user | change my profile information or password | so that everything is up to date. |
| Shopper | Add payment information | So i can pay |
| Site user | Easily register for account | So that i can buy items |
| Site user | Easily change informations in my profile | So my adress and informations are correct. |
Homepage:
- The site is styled using bootstrap for responsive design
- Fixed navbar, incorporating search form and site navigation links
- Buttons linking to product areas of the site
- Footer with social media links and email informationd and a small about section.
- Background image
- Course page
- Accessories page
- Travel page
- A bit more information on the home page
- Ability to add items to chart
- Se chart and delete and add items
- Testing in readme
- Deployment in readme
- Login/logut
- Profile
- Paymethods
- Signup form
- adding products
- Crispy forms used to display product info Bootstrap card format to display product image/details
- more CSS
- More wireframes
Languages:
-
HTML5 HTML was used for the main structure of the website.
-
CSS3 CSS was used to style and change sizes.
-
Javascript Was used on the dynamic functions on the site
-
Python3 Used as Back-End programming language
-
BSON for accessing the data in MongoDB and to access IDs.
-
Django
Database: *
- Heroku Used for hosting my full stack app.
Tools & Libraries:
- Gitpod
- Github
- Font-Awsome
- Google Fonts
- Google Chrome
- Wireframes
- Created a new application using the Heroku dashboard.
- Go to settings tab, click on 'reveal config vars' and add config vars such as IP (0.0.0.0), PORT (5000), MongoDB Name, MongoDB URI URL with DB name and password.
- Install Heroku via the console using npm install -g Heroku.
- Push two new files (requirements.txt and Profile) to repository.
- Now in In Heroku, you can Enable Automatic Deployment
- Then deploy branch.
- That can take a minute to build, once it's done, The message ‘Your app was successfully deployed.’ will be shown then Click ‘View’ to launch your new app:
Pexels.com
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent