Code Monkey home page Code Monkey logo

realtime-calendar's Introduction

Event Calendar

This is a simple calendar app using nodejs backend, angular frontend and mongodb database. Also implemented soket.io for real-time change.

Features

  • Different calendar view (Day, Week ,Month, Year)
  • Add, Delete , Edit event
  • Events display in events day
  • Real-time update in every client

Background

I started this project without any knowledge of Node , Angular , Mongo. So i research about this and start following a tutorial in YouTube. I implemented all the things and try to understand basic of node , mongoose, angular, mongodb. When i start implementing i face many problem like:

  • href not working from angular (solve putting a extra ! - #/event/add to #!/event/add )
  • Socket connect multiple time (solved by adding {transports: ['websocket'], upgrade: false}
  • Http call from client not working as video ( solved by a new method )
  • Have huge confusion between ES6 and ES5 . I see the syntax of es6 but cannot implemented it
  • and so on

Requirement

  • Single-page web application using AngularJS (frontend layer)
  • REST API NodeJS application using Express for adding, editing, or removing an event (backend layer)
  • Main view shall consist of a calendar of a month, with “next” and “previous” buttons to go to another month
  • A "+" button inside every inside the date box for adding an event (partially completed)
  • Real-time update to all opened browser using socket io
  • Keep track of when an event was created and updated

Thought Process

Thought Process

Used Technology

  1. Mongo Database
  2. Mongoose ODM
  3. Express Application Framework
  4. AngularJS Framework
  5. Bootstrap CSS Framework
  6. Socket IO

Prerequisites

First you need to install Node.js ,Mongo DB in your machine

  • Install Node.js

  • Install and Run Mongo DB from your installation directory

mongod

Installing

  • Clone the repository
git clone https://github.com/amitbd1508/Realtime-calendar.git
  • Then Change your directory using
cd Realtime-calendar/
  • Run
npm install
cd client
bower install
cd ..
node app.js

App running on http://localhost:8000/

Running the tests

I don not write any test code . In future i will add the test code

Built With

Contributing

You are welcome to contribute

Authors

See also the list of contributors who participated in this project.

License

This project is licensed under ISC License

Copyright (c) [2018], [Amit Ghosh]

Permission to use, copy, modify, and/or distribute this software for any purpose with or without fee is hereby granted, provided that the above copyright notice and this permission notice appear in all copies.

THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE.

Acknowledgments

realtime-calendar's People

Contributors

amitbd1508 avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar

realtime-calendar'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.