Toddler Town

Table of Contents

• Introduction
• Design Process
• Layouts and Frameworks used
• App Presentation
• What can the app do?
• Deployment
• Credits

Introduction

Working parents, especially a mother always finds it difficult to join back her work because they do not have much resources to send their young ones to a good day care.Picking an option from so many options available online and in person is always a big task.Especially for kids with special needs or who need extra attention, finalizing a good day care is of utmost importance.We’ve tried to address these problems by creating an app that allows a user to select a city where they reside/ or are planning to go and know about the 10 best and affordable day cares in their location.The user will be presented with the complete detail about a particular day care which will include its address, contacts and weblink to name a few.Not only this, but if the user wants to ask any question, in general, about a specific topic or wants to give in more information, they can go to our reviews section and share their information with others.

Design Process

• Built a full stack app using the MVC paradigm, created our  server-side API, added user authentication, and connected the app to a database and deployed the app on a web server.
• Built on the agile development methodologies that we have  used throughout this course.
• Instead of using the  HTML for the front end, used handlebars for displaying the front end version of the app.
• All of this information is stored directly in our website for easy access.
• We used a framework that was both easy-to use, but also responsive and optimize for the user’s experience.
• We used Heroku web server to host our app and added a third party JAWS DB in order to display the seeded contents from the database.
• The steps involved in designing mainy dealt with designing the MVC code and using the MYSQL workbench to seed the necessary data.

Layouts and Frameworks used

1. Libraries - In order to run the app, we installed alot of libraries, namely,

• npm install sequelize
• npm install dotenv
• npm install mysql2
• npm install express
• npm install express-handlebars
• npm install bcrypt
• npm install express-session

2. Frameworks : We used the following frameworks to obtain font icons for our website and ready-to-use front-end components!

• Font Awesome
• Bulma

3. Database: We used it in order to create our input and seed it into our web app

   • My SQL

4. Frontend, Backend and Styling : For this app, we skipped the html layout for our front end and used the normal styling techniches that has been used till now

• Handlebars
• CSS3
• JavaScript

Along with it,we deployed our app through Heroku web host andConfigured an additional add on JAWS DB in order to relate our code and database.

App Presentation

The web app created can be run either from the server using localhost:3001 or through the heroku link. Once uploaded, the web page looks something like this.

Loading page

Login and Signup Page

Loggedin and Cities Displayed

Logged in

Cities Displayed

Reviews, Discussions and Editing Comments Page

What can the app do?

This app can prove to be a one stop desitination for all the parents who are looking for food but affordable day care centers in their areas.For now, a user living in any of the six cities from our daabase can log in or signup with our app and search for the top 10 day care centers. On clicking the chosen city, the user is provided with all the delated related to the day care centers in their areas, that includes their name, address, contact number,the age group of the child and the web link for the day care center that they want to browse. Not only this, if the use has any questions or even if they want to have a general discussion about the centers,he can go to the reviews section and enter a comment or start a new discussion. If you thOur database consists of almost day care providers from accross the country which gives the user a good range for deciding a day care that fits in their budget and is kids friendly as well.

Deployment

The app has been deployed on GITHUB, where all the codes are visible, and the working web app has been deployed on heroku

• The URL of the Github repo
• 

Credits

The project has been assigned by the Carleton University Coding Bootcamp, our instructor and the TA's