Giter VIP home page Giter VIP logo

fooradise's Introduction

Hi there πŸ‘‹

  • πŸ”­ I’m currently working on Mask R-CNN
  • 🌱 I’m currently learning Python and MRCNN
  • πŸ‘― I’m looking to collaborate on ...
  • πŸ€” I’m looking for help with depression.
  • πŸ’¬ Ask me about anything X&Y related.
  • πŸ“« How to reach me: You don't find me. I find you.
  • πŸ˜„ Pronouns: Phong || Fong || Wind || be creative
  • ⚑ Fun fact: I'm an atheist and an advocator for All Lives Matter (What? U mad, bro?).
  • 🐧 Looking forward to learn Kotlin, React and React Native in the future.

fooradise's People

Contributors

dannguyen99 avatar dependabot[bot] avatar phongvu99 avatar

Stargazers

 avatar

Watchers

 avatar

fooradise's Issues

As a home cook, I want to leave comments on the recipe, so that I can discuss about the dish with others

Requirements

  • Have a good understanding of basics HTML, CSS, and JS.
  • Learn about database (pSQL, MongoDB, ...)
  • Learn one of the front-end frameworks: Angular, Vue, React, ...
  • Learn Bootstrap, The most popular HTML, CSS, and JavaScript framework for developing responsive, mobile first projects on the web.
  • Learn to use Disqus, the online platform to submit your opinion

High Level Design

  • Design the comment interface
  • Configure the database for the website

Low Level Design

  • Implement the database for the site
  • Implement the comment section for each recipe

Testing

  • Test the Disqus form
  • Test the function under different circumstances (Desktop or Mobile)
  • Meet up with the testers to discuss the result and improve the function if possible

Outcome

https://fooradise.herokuapp.com/recipes/21 Comment section

As a home cook, I want to be amazed each visit by a random recipe, so that I can try out a new dish a day

Requirements

  • Have a good understanding of basics HTML, CSS, and JS.
  • Learn about database (pSQL, MongoDB, ...)
  • Learn one of the front-end frameworks: Angular, Vue, React, ...
  • Learn Bootstrap, The most popular HTML, CSS, and JavaScript framework for developing responsive, mobile first projects on the web.
  • Read about Bootstrap's Form section

High Level Design

  • Design the random function
  • Configure the database for the website

Low Level Design

  • Implement the database for the site
  • Implement the random function for the random recipe button

Testing

  • Test the random recipe function
  • Test the function under different circumstances (Desktop or Mobile)
  • Meet up with the testers to discuss the result and improve the function if possible

Outcome

random function
see it in action

As an user, I want to view the page on my phone, so that I don’t need to use my PC or Laptop everytime

Requirements

  • Have a good understanding of basics HTML, CSS and JS.
  • Learn one of the front-end frameworks: Angular, Vue, React, ...
  • Learn Bootstrap, The most popular HTML, CSS, and JavaScript framework for developing responsive, mobile first projects on the web.

High-level design

  • Design the breakpoints (used to responsively display the site on different devices)
  • Design the UI

Low-level design

  • Set a breakpoint for each content container
  • Implement Bootstrap responsive class like container-fluid, img-fluid, ... to make container or image responsive
  • Implement Bootstrap grid system for responsive display
  • Add images and descriptions of the recipes

Testing

  • Using the responsive mode in different browsers to test the responsiveness of the site
  • Resizing the browser window to see the effect of the breakpoint
  • Test the site under various circumstances (Desktop and Mobile)
  • Meet up with the testers to discuss the result and improve the design if possible

Outcome

navbar
container
footer
see it in action

Backstory

Long story short, I took her home, I was trying to make Cheese Cake but the oven was broken. At that point, I knew I had to create a website dedicated to repair the oven.
But, the point is I don't even own an oven.
That's why we need this website to cook without ovens.

As a professional cook, I want to contribute my own recipes so that I can share my culinary knowledge to visitors of the site

Requirements

  • Have a good understanding of basics HTML, CSS, and JS.
  • Learn about database (pSQL, MongoDB, ...)
  • Learn one of the front-end frameworks: Angular, Vue, React, ...
  • Learn Bootstrap, The most popular HTML, CSS, and JavaScript framework for developing responsive, mobile first projects on the web.
  • Read about Bootstrap's Form section

High Level Design

  • Design a form for submitting user recipe
  • Configure the database

Low Level Design

  • Set constraints for the form (for checking the form's content before submitting)
  • Create a function to feed new user data to the database
  • Create a function to take the user data and generates a new user's content page
  • Utilizing Bootstrap's form class to create a responsive form

Testing

  • Test the form's content checking ability
  • Give the form a sample recipe
  • Test the form on both Mobile and Desktop devices
  • Meet up with the testers to discuss the result and improve the function if possible

Outcome

submit a recipe
see it in action

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.