tfletch3018 / babysittr

An app designed to promote more efficient communication between parents and caregivers

Project 1

Application Requirements

Your project should fulfill the following requirements:

• Use a CSS framework other than Bootstrap.
• Be deployed to GitHub Pages.
• Be interactive (i.e., accept and respond to user input).
• Use at least two server-side APIs.
• Does not use alerts, confirms, or prompts (use modals).
• Use client-side storage to store persistent data.
• Be responsive.
• Have a polished UI.
• Have a clean repository that meets quality coding standards (file structure, naming conventions, follows best practices for class/id naming conventions, indentation, quality comments, etc.).
• Have a quality README (with unique name, description, technologies used, screenshot, and link to deployed application).

Presentation Requirements

• Elevator pitch: a one minute description of your application
• Concept: What is your user story? What was your motivation for development?
• Process: What were the technologies used? How were tasks and roles broken down and assigned? What challenges did you encounter? What were your successes?
• Demo: Show your stuff!
• Directions for Future Development
• Links to the deployed application and the GitHub repository

Grading Metrics

Metric	Weight
Technical Criteria	25%
Concept	10%
Deployment	20%
Repository Quality	10%
Application Quality	15%
Presentation	10%
Collaboration	10%

Grading Requirements

This project is graded based on the following criteria:

Technical Acceptance Criteria: 25%

• Satisfies the following code requirements:
  • Application uses at least two server-side APIs.
  • Application uses client-side storage to store persistent data.
  • Application doesn't use JS alerts, prompts, or confirms (uses modals instead).
  • Application uses a CSS framework other than Bootstrap.
  • Application is interactive (accepts and responds to user input)

Concept 10%

• Application should be a unique and novel idea.
• Your group should clearly and concisely articulate your project idea.

Deployment: 20%

• Application deployed at live URL and loads with no errors.
• Application GitHub URL submitted.

Repository Quality: 10%

• Repository has a unique name.
• Repository follows best practices for file structure and naming conventions.
• Repository follows best practices for class/id naming conventions, indentation, quality comments, etc.
• Repository contains multiple descriptive commit messages.
• Repository contains a quality README file with description, screenshot, and link to deployed application.

Application Quality: 15%

• Application user experience is intuitive and easy to navigate.
• Application user interface style is clean and polished.
• Application is responsive.

Presentation 10%

• Your group should present using Powerpoint or a similar presentation software.
• Every group member should speak during the presentation.

Collaboration 10%

• There are no major disparities in the number of GitHub contributions between group members.

Submission on BCS

Each member is required to submit the following:

• The URL of the deployed application.
• The URL of the GitHub repository.

Approach: We used a combination of HTML and CSS to structure our page. We all love CSS because it gives web developers a more precise level of control over a webpage's layout, typography and overall visual aesthetic. We were tasked with choosing aframework other than Bootstrap and we chose Bulma, a CSS solution based on flexbox layout. Inclusive of an extensive range of built in features, promotes faster turnaround and less CSS coding! Javascript enabled us to dynamically code HTML, allowing us to change the page view and add information to the page without making a server request, increasing the overall satisfaction of the UI. We used two API's that enabled us to fetch data, allowing for an interactive experience with our users as we can pull data based on their previous searches. The result is an interactive application that allows users to both enter and retreive information.

Installation: Clone ssh key Open your terminal: "git clone" To share any changes git add . git commit -m "explanation of changes" git push

Finished Project:

Our QR Code: <img src="assets/images/qr-code.png"

Visit this repository at

Our page is live on Github!