Giter Club home page Giter Club logo

ask_paddy's Introduction

Ask Paddy

Ask Paddy is Team 17's entry for the Code Institute March hackathon. The idea is that users can ask St. Patrick any question they want, an almost direct link to God.


Table of Contents

Project overview

UX

Features

Technologies Used

Testing

Deployment

Credits


Project Overview

AmIResponsive


User Stories

  • User Story A: As a User, I wanted to how long it was for it to be Saint Patrick's Day again so I visited Ask Paddy App to check their Saint Patrick's Day Countdow.
  • User Story B: As a User, I was curious to know what Saint Patrick would answer to my question, so I submitted my question on Ask Paddy App.
  • User Story C: As a User, I wanted to play a quiz of about Saint Patrick's Day, so I visited Ask Paddy App.

Opportunities arising from user stories:

Opportunities Importance Viability / Feasibility
Simple Clean UI 5 5
Clearly indicate purpose 5 5
Clear Simple Instructions 5 5

Design

A standard layout that is fully responsive on mobile devices and larger screens.

Color Scheme

Color Palette

Typography

We choose Marcellus because it has a Celtic feel
and Poppins for the body because it is very easy to read.

Media

AmIResponsive

Paddy image was created by the team using Affinity Designer

Wireframes

AmIResponsive

We made our wireframe with paper and pen as time was a constraint.

back to top

Features

Existing Features

Navbar

  • The navigation bar features links to our Countdown, Ask a Question and Quiz Sections.

Body

  • The body features an Interactive image of Saint Patrick.
  • A Countdown to Saint Patrick's Day.
  • A form to submit your Questions to Saint Patrick.
  • A fun Quiz about Saint Patrick.

Footer

The footer features:

  • Social Media links.
back to top

Technologies Used

1. Languages

HTML5 HTML 5

CSS3 CSS 3

JavaScript Java Script

2.Integration

BOOTSTRAP Bootstrap

GOOGLEFONTS Google Fonts

EMAILJS

3. Workspace, version control and Repository storage

GIT GIT

GITHUB GITHUB

Resources

Code Institute Course Content
Code Institute SLACK Community
Youtube - General resource.
Am I Responsive - Responsive website mockup image generator.


Testing

  • Tested the Countdown and it works without any problem.
  • The quiz highligts the correct and wrong answer perfectly.
  • Image of Saint Patrick winks when mouse hover.
  • Question submission form is functional.
  • Background color changegs to white when selected.

Lighthouse

Performance, Accessibility, Best Practices & SEO were tested using Google Lighthouse.

Lighthouse

Deployment

This project has been deployed on GitHub Pages with the following process:

  • Master Repository was created by Sean on Github.
  • All code was written on GitPod, the code was then pushed to GitHub where it is stored in his Repository.
  • Contribuitions were made through Forking and Merging team memeber branches with the Master branch.

Credits

Content

  1. Quiz Code modified from youtube tutorial by Web Simplified
  2. GitHub in a Team
  3. Forking and Merging GitHub

Acknowledgements

  1. We would like to thank our Mentor Jim for his help on this project.
  2. Thank all of our Team Members for their efforts on building this project.

This project is for educational use only

back to top

ask_paddy's People

Contributors

mayasharma2110 avatar mdnrita avatar sean-mc-mahon avatar thaysom22 avatar

Stargazers

 avatar

Watchers

 avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.