diff --git a/.DS_Store b/.DS_Store new file mode 100644 index 000000000..e865ec0d3 Binary files /dev/null and b/.DS_Store differ diff --git a/.env b/.env new file mode 100644 index 000000000..dd7065e73 --- /dev/null +++ b/.env @@ -0,0 +1,4 @@ +USER=aszadaphiya +PASS=aarsh + +HOST=a3-aarshzadaphiya.rnuxw22.mongodb.net/?retryWrites=true&w=majority \ No newline at end of file diff --git a/.gitifgnore b/.gitifgnore new file mode 100644 index 000000000..2eea525d8 --- /dev/null +++ b/.gitifgnore @@ -0,0 +1 @@ +.env \ No newline at end of file diff --git a/BMI Page.png b/BMI Page.png new file mode 100644 index 000000000..662c5fca0 Binary files /dev/null and b/BMI Page.png differ diff --git a/Lighthouse Test.png b/Lighthouse Test.png new file mode 100644 index 000000000..4e229eb8a Binary files /dev/null and b/Lighthouse Test.png differ diff --git a/README.md b/README.md index 8a31308ca..795196f7d 100644 --- a/README.md +++ b/README.md @@ -1,114 +1,44 @@ -Assignment 3 - Persistence: Two-tier Web Application with Database, Express server, and CSS template -=== +# BMI Calculator -Due: September 25nd, by 11:59 AM. +**Glitch link:** [https://a3-aarsh-zadaphiya.glitch.me/](https://a3-aarsh-zadaphiya.glitch.me/) -This assignnment continues where we left off, extending it to use the most popular Node.js server framework (express), -a database (mongodb), and a CSS application framework / template of your choice (Boostrap, Material Design, Semantic UI, Pure etc.) +**Username:** username +**Password:** password -Baseline Requirements ---- +## Summary +BMI Calculator is a web application designed to assist users in monitoring their BMI (Body Mass Index). It takes the user's height, weight, age, and gender to calculate their body mass index. It keeps track of the user's BMI every time and summarizes it by date when they add their new measurements. The main challenges transitioning to Express and using MongoDB to store the database. -Your application is required to implement the following functionalities: +## CSS Framework +I have used **Bootstrap CSS**. Bootstrap is a popular and widely used front-end framework that provides a set of pre-designed CSS and JavaScript components for building responsive and visually appealing web applications. I have used it to style and structure the webpage, incorporating elements such as form controls, buttons, typography, spacing, and an alert component for a cohesive and responsive design. I made some modifications to bootstrap elements (e.g., changed button text to be bold and use font that is consistent with the rest of the app). -- a `Server`, created using Express (no alternatives will be accepted for this assignment) -- a `Results` functionality which shows all data associated with a logged in user (except passwords) -- a `Form/Entry` functionality which allows users to add, modify, and delete data items (must be all three!) associated with their user name / account. -- Persistent data storage in between server sessions using [mongodb](https://www.mongodb.com/cloud/atlas) (you *must* use mongodb for this assignment). You can use either the [official mongodb node.js library](https://www.npmjs.com/package/mongodb) or use the [Mongoose library](https://www.npmjs.com/package/mongoose), which enables you to define formal schemas for your database. Please be aware that the course staff cannot provide in-depth support for use of Mongoose. -- Use of a [CSS framework or template](https://github.com/troxler/awesome-css-frameworks). -This should do the bulk of your styling/CSS for you and be appropriate to your application. -For example, don't use [NES.css](https://nostalgic-css.github.io/NES.css/) (which is awesome!) unless you're creating a game or some type of retro 80s site. +## Middleware Packages -Your application is required to demonstrate the use of the following concepts: - -HTML: -- HTML input tags and form fields of various flavors (`