Alkaios Strength through fitness. Website for a community orientated gymnasium for all, regardless of ability or fitness levels. This is a place to come for classes and to see the gym and its resources.
Expected users of the website include:
- Fitness enthusiasts
- Fitness newcomers looking for classes
- Fitness newcomers looking for information on the gym
- Users looking for pictures of the gyms facilities
- A user wants to learn more about classes held.
- A user requires information on the gym's look and feel with a view to becoming a member.
- A user wants to contact the gym about special requirements.
- A user needs information on the gyms location
- 4 page site with nav bar.
- Roboto and Exo fonts used throughout the website.
- font-family: Roboto, Exo , sans-serif as a fall back.
- Colour scheme consists of complementary colours.
-
#052C6E
-
#29497F
-
#1049A9
-
#FFA400
- User Flow
- Animations
- Transitions
- Git - Version Control System
- GitHub - Remote Repository
- Deployed and Hosted on GitHub Pages
- Logo
- Moto
- Colour Scheme
- HTML 5
- CSS 3
- Bootstrap 4
- Grid
- Cards
- Carousel
- Modal
- Responsive design
- Mobile First
- HTML 5
- CSS 3
- Bootstrap
- Grid System
- Columns and Rows
- images
- Responsive design
- Mobile First
- UX elements
- Animations/Transitions
- Git - Version Control System
- GitHub - Remote Repository
- Deployed - Hosted on GitHub Pages
- Payment gateway for membership portal
- full calendar Schedule for classes.
This project makes use of:
- HTML
- HTML for strucutre
- CSS
- CSS for Styling
- JavaScript
- JavaScript for application controller
- Google Chrome
- Used for browser and dev tools
- Google
- Google was used for research.
- Bootstrap
- HTML and CSS Framework from Bootstrap
- GitPod
- This project was built using the GitPod IDE
- Git
- Git used for Version Control
- GitHub
- Repository hosted on GitHub
- Github Pages
- Website hosted on Github Pages
- Am I Responsive
- Testing responsiveness of the website
-
All HTML pages checked at https://validator.w3.org/ no errors or warnings reported.
- index.html 1 error which was correted.
-
The W3C CSS Validation Service at https://jigsaw.w3.org/css-validator/ was used to verify the css
- 2 errors that were corected'
-
Family member tested on Galaxy S 7 reported that all looked good and worked as expected.
-
Family member tested on Lenovo Tab reported error in home page in landscape.
- corrected with media querie.
-
I tested on HP Omen Laptop all looked good and worked as expected.
-
Family friend tested on an iPad and reported that it does not display well.
- I was unable to access an iPad to reproduce the error. Chrome dev tools displayed it as expected when using the iPad setting.
The project is hosted on GitHub Pages
The process involved:
- Host a git repository on GitHub. Explained here.
- The root folder contains README.md and index.html files
- On GitHub repository settings page move to GitHub Pages section
- Change source to master branch. (Or any desired branch)
- Provided link will be your projects home (index) page.
To deploy your own version of the website:
-
Have git installed
-
Visit the repository
-
Click 'Clone or download' and copy the code for http
-
Open your chosen IDE (Cloud9, VS Code, etc.)
-
Open a terminal in your root directory
-
Type 'git clone ' followed by the code taken from github repository
git clone https://github.com/s10n/alkaios.git
-
When this completes you have your own version of the website
-
The website can be run by opening one of the HTML files within a web browser
-
Visit the link provided
-
Your website with any made changes will appear
-
Saved changes to the website will appear here after refreshing the page
The benefits of hosting your website on GitHub pages is that any pushed changes to your project will automatically update the website. Development branches can be created and merged to the master when complete.
It may take a moment for changes to appear on the hosted website.
During development the site was written using Gitpod.
- The text on the website has been copied and edited from: https://dlrleisure.ie/dlr-leisure-monkstown/
- The Contact page has been adapted from an idea on https://mdbootstrap.com/
- The Media page has been adapted from an idea on https://mdbootstrap.com/
- The classes page was adapted from an idea on https://ashleydw.github.io/lightbox/#image-gallery
- The read me file has been adapted from the structure shown on https://github.com/Pattern-Projects/oireachtas-ifd-project/blob/master/README.md
Some of the images for the website are taken from:
- Code Institute for allowing me to extend the project time to accommodate a busy work period.
- Thank you to - Seun Owonikoko @seun_mentor for the direction I needed.
- Also to my 9 yr. old son Tomás for being impressed and keeping me motivated.