Git Product home page Git Product logo

zjw-92 / homecook Goto Github PK

View Code? Open in Web Editor NEW
1.0 1.0 0.0 672 KB

This is the assignment of DIT341 Mobile and Web Development HT20. This course covers key concepts, technologies, and skills for server-side and client-side Web and mobile programming, with a particular focus on basic technologies for interactive full- stack Web programming (HTML, CSS, JavaScript).

JavaScript 42.86% HTML 1.52% Vue 55.63%

homecook's Introduction

Backend and Frontend Template

Latest version: https://git.ita.chalmers.se/courses/dit341/group-00-web (public Github mirror)

Project Structure

File Purpose What you do?
server/ Backend server code All your server code
server/README.md Everything about the server READ ME carefully!
client/ Frontend client code All your client code
client/README.md Everything about the client READ ME carefully!
docs/DEPLOYMENT.md Free online production deployment Deploy your app online in production mode
docs/LOCAL_DEPLOYMENT.md Local production deployment Deploy your app local in production mode

Requirements

The version numbers in brackets indicate the tested versions but feel free to use more recent versions. You can also use alternative tools if you know how to configure them (e.g., Firefox instead of Chrome).

Getting started

# Clone repository
git clone [email protected]:courses/dit341/group-00-web.git

# Change into the directory
cd group-00-web

# Setup backend
cd server && npm install
npm run dev

# Setup frontend
cd client && npm install
npm run serve

Check out the detailed instructions for backend and frontend.

Visual Studio Code (VSCode)

Open the server and client in separate VSCode workspaces or open the combined backend-frontend.code-workspace. Otherwise, workspace-specific settings don't work properly.

System Definition (MS0)

Purpose

The system ‘Home Cook’ is a Food and Drinks recipe system. The user of this application can search for a recipe that uses certain ingredients and/or has a certain amount of calories in it. The user can also search by certain type of meal for example : breakfast, fika etc. The application should provide a list of recipes according to the users search criteria.

Pages

  • Home: This page contains three search boxes for ingredients, calories and meal type. ‘Create account’ and ‘login’ buttons are also on this page but if the user is already logged in, the ‘My account’ and ‘log out’ button is displayed instead. The user can write down in the search box or select an option from a drop down list or choose to create an account or log in/out.
  • Recipe List: This page contains a list of names for recipes that meets the search criteria of the user. The user can click on the recipe name. The user can save the recipe as well.
  • Recipe: This page displays the recipe along with a picture, its ingredients, calorie amount and preparation time and a saving option. There is also a Review section with comment box and rating option. The user can save the recipe, give feedback by writing comments and giving a rate.
  • Create Recipe: This page displays boxes to include a recipe decription to create a recipe. The user can create a recipe in this page.
  • Saved Recipe: This page shows a list of recipes saved by the user and a ‘delete button’. The user can click on the recipe name and go to the recipe page and click the ‘delete button’ to delete a recipe.
  • Create Account: This page displays empty boxes to fill up with users first name, last name and choose a password to create an account. The user can create an account on this page.
  • My Account: This page displays the users information when logged in and a ‘Edit account’ button. Users can go to the ‘Edit account’ and ‘Saved Recipe’ page from this page.
  • Edit Account: This page displays all the users information and a 'save' button.Here the user can edit and save their personal information.

Entity-Relationship (ER) Diagram

ER Diagram

Teaser (MS3)

Teaser

homecook's People

Contributors

zjw-92 avatar

Stargazers

 avatar

Watchers

 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.