Giter Site home page Giter Site logo

hsins-lab / mern-todo-list Goto Github PK

View Code? Open in Web Editor NEW
72.0 1.0 28.0 3.81 MB

🧪 A hands-on project from the Udemy course - "The Advanced Web Developer Bootcamp" by Colt Steele. Refactored using the React-Redux in ES6/ES7 syntax instead of jQuery.

Home Page: https://hsins-mern-todolist.herokuapp.com/

License: MIT License

JavaScript 82.18% HTML 3.88% CSS 13.94%
udemy udemy-course-project react react-redux mern-project

mern-todo-list's Introduction

Udemy Project: MERN Todo-List

This is a hands-on project from the Udemy course - The Advanced Web Developer Bootcamp by Colt Steele. Refactored using the React-Redux in ES6/ES7 syntax instead of jQuery. You can find this jQuery version here.

Demo

You can see a complete working example here. Or you can run the demo on your local machine, please follow the instructions in Getting Started.

Features

  • A MERN (MongoDB + Express.js + React.js + Node.js) full stack project.
  • Refactored with ES6 and ES7 syntax (eg: async/await)
  • RESTful API:
-------------------------------------------------------------------------
Todos Route
-------------------------------------------------------------------------
[Method]  [Route]
GET       /api/todos              Fetch all todos
POST      /api/todos              Create a new todo
GET       /api/todos/:id          Fetch a todo status
POST      /api/todos/:id          Toggle (complete or not) a task
PATCH     /api/todos/:id          Update the todo content
DELETE    /api/todos/:id          Delete todo

Technologies

Frontend

Backend

Check package.json file for more information.

Getting Started

Follow the instructions below to set up the environment and run this project on your local machine. Note that you should setup your MongoDB Atlas Cluster first to get your database. You can find the Quick Note here.

  1. Clone this repository.
# Clone repository
$ git clone https://github.com/Hsins/udemy_MERN-Todo-List.git
  1. Install dependencies via NPM or Yarn
# Install dependencies via npm
$ npm install
$ cd client
$ npm install
$ cd ..

# Install dependencies via yarn
$ yarn install
$ cd client
$ yarn install
$ cd ..
  1. Run the server.
# Run server
$ npm run dev

More Information

All the notes I took in Markdown (.md) format. You can find them in my Udemy-Notes repository. The note for this course is here.

License

Licensed under the MIT License, Copyright © 2017-present Hsins.

mern-todo-list's People

Contributors

dependabot[bot] avatar hsins avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar

mern-todo-list's Issues

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.