Materialized Calender in AngularJS with MySql and Nodejs (Calendars)

EventsX- Materialized Calender

• • HighLights

    • This calender can be used as event manager, appointment manager, or as a planner. This is very useful in office, clinic or any front desk where random events need to maintain in calender.

      This is a angularjs based calender with materialize css. It has backend as mysql and nodejs.

    • Materialize CSS framework
    • Full Calender
    • Materialize clock-picker
    • Materialize color-picker
    • Drag and Drop events and then edit
    • Materialize datepicker with month and year selectable
    • Babel javascript
    • Can be extended to full Admin panel
    • Socket.IO with live data broadcasting

• v 0.1

  Initial Version

• Pre-requisites
  • 1.Node http://nodejs.org/ (Server)
  • 2.MySql https://www.mysql.com/downloads/ (Database)
• Live Demo
  • Live Demo – Hosted on Heroku

• Technology Stack Used

• MySql 5.7
• Express 4.9
• AngularJS 1.4.9
• Node.JS 4.2.3

• Install

• Run the following commands and the application will start automatically

  npm install yo -g (Install yeoman for scaffolding web application)

  npm install grunt-cli -g (This creates and runs javascript repetative tasks) 

  npm install bower -g ( A frontend package manager for web applications) 

  npm install (Install all nodejs dependencies, also automatically installs bower components)

• Buid and Run

  grunt serve  [for running in dev environment with livereload]  

  grunt serve:dist  [Buid and run in production mode]  

  grunt --force  [buid with Administrator rights]

  Note : If any of the test failed or any error in running application, please install npm and bower with latest verion
  and in Administrator mode in command prompt

• Usage

   npm install -g generator-angular-fullstack 

  Create ES6 based ReST API

   yo angular-fullstack:endpoint brand [DESIRED_TABLE_NAME] 

   yo angular-fullstack:route brand [DESIRED_HTML_PAGES_NAME] 

   yo angular-fullstack:controller brand    

   yo angular-fullstack:directive [Custom Directive] 

   yo angular-fullstack:filter [Custom Filter Name]

   yo angular-fullstack:factory [Custom Factory Name] 

• All Features
  • Real time sync data from any client
  • Authentication with role
  • Realtime updates – Any changes to database is updated in Realtime
  • Token expire time
  • Session management
  • Login
  • Change Password
  • Password encryption with SHA1
  • Automatic minification, compression, CDNify during deployment
  • Live reaload while development
  • User roles
  • Auto selection of resources for development and production
  • API with role based authentication
  • SEO optimized title for each page using keystone.utils for slugify
  • Responsive front end to fit any screen
  • Modular code structure for faster development
  • Each module is placed inside its own directory for easy management
  • Separate configuration envirnoment for development and production
  • Message for post confirmation/error
  • Sliding system – so that user won’t have to leave the page for updation

Download Materialized Calender in AngularJS with MySql and Nodejs (Calendars)