https://mikeemorales.github.io/The_Aquascape/html/index.html
TheAquascape is intended to provide FREE information on starting a live planted, fresh-water aquarium and how to maintain them in the healthiest way possible. With the main focus being an informational website, this site will also contain a forum portion where users can sign up, build a profile, ask questions, share tank photos, chat with one another, and have the opportunity to win giveaways to help maintain their tanks (for users who sign up only).
What started as a simple hobby of mine, became a personal project intended to help bring more awareness to this creative and natural hobby.
-
As a user, I want to learn how to build and maintain an aquascape.
-
As a user who has signed up to this website, I want to be able to connect with other members and be able to communicate anything I need with them.
My intentions are to provide free information on maintaining a fresh-water aquarium and awareness to this style of aquarium-keeping.
I want to create a database of free information in one centralized website. Pro's and Con's of small and large tanks, types of fish you can house, types of plants you can grow, how tank cycling works, water care and how to introduce beneficial bacteria safely and effectively, etc.
The most important page of this website will be the first page in the navigation bar labeled "Beginner's Guide." This is a page that leads to the six important functions of an aquascape:
- Aquarium Size
- Water Care
- Cycling
- Algae Control
- Flora
- Fauna
The second most essential part of this website is the "Forums" page. This leads to a signup/signin portion of the website, where users can create profiles to access private topics and conversations.
key information:
navbar will be in dark grey, with white text for each page. The Sign in button will reside within the nav as well, with a blue-rounded background button.
each page will have a header image containing a tagline and small description of what the page is about. The index page will contain a sign up modal button.
the footer will contain three columns. Another navigation section to prevent having to scroll back up top to the original nav, a newsletter signup incase the user does not want to create an official account, but would like marketing updates, and a mission statement as the last column.
fonts used across the board are: QUICKSAND - with a back up of sans serif.
the primary colors for this website will be grey, white, and blue. secondary colors will be utilized to add small detail.
- html
- css
- bootstrap (related js included)
This site mainly features bootstrap functions (modal, js, grid system, etc.) with customized edits in the css files.
Each page has been tested via web browser and browser source viewer.
Using the source code in the browser, various screen size testing has been implemented to ensure website functions properly across multiple devices.
Contact information, login, sign up, etc. required sections have been tested to ensure that an alert may pop up when a section is left blank. If you try to submit a form without a proper email, an alert will pop up stating that said proper email is required.
The footer contains a link for the instagram account of TheAquascape. "target=_blank" has been used to launch a new window to access the instagram account and has been found succcessful.
- Beginner's guide sub pages: Only the "Aquarium Size" subpage button has a working subpage. The rest only have descriptions of what the subpages contain. Due to the vast amount of information needed, content will be updated at a later time for said subpages.
- Log In's and Sign Up's are currently for aesthetic purpose. Database and internal framework has not been implemented at this point.
- Forum page is currently for aesthetic purpose. Database and internal framework has not been implemented at this point.
- Forms are currently for aesthetic purpose. Database and internal framework for submitting has not been implemented at this point.
- The only social media linked to this website is an instagram page (which is fully functional and running). This link is located in the footer. No other social icons (fb,linkedin,email) are needed for this website.
This site is deployed through Github Pages directly through the master branch. As I work on this project at work and from home, I have installed the github desktop application to push commits whenever I'm at a different location. A link has been provided at the top of this document to view the website.
-
The information provided on this website has been through my original copy and has formed through personal experiences I've had through this hobby. Taglines and header descriptions are all original as well.
-
Photos have been pulled through free google/images until original content can be photographed or provided by TheAquascape community members (images are currently placeholders for visual value)
- Inspiration for this passion project has been through personal experiences of this hobby. As an aquarium hobbyist for over 15 years, I have decided to culminate a series of information that I find effective through personal experience. In the future as this website progresses, community members experiences and techniques for solving problems will be provided for educational use and will be properly credited.
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent