⚡ Backbone Employee Project

• Tutorial project using the Backbone.js library together with jQuery.
• Note: to open web links in a new window use: ctrl+click on link

📄 Table of contents

• ⚡ Backbone Employee Project
  • 📄 Table of contents
  • 📚 General info
  • 📷 Screenshots
  • 📶 Technologies
  • 💾 Setup
  • 💻 Code Examples
  • 🆒 Features
  • 📋 Status & To-Do List
  • 👏 Inspiration
  • 📁 License
  • ✉️ Contact

📚 General info

• Backbone.js gives structure to web applications by providing models with key-value binding and custom events, collections with a rich API of enumerable functions, views with declarative event handling, and connects it all to your existing API over a RESTful JSON interface.
• BackboneJS architecture contains the following modules −

1. HTTP Request
2. Router
3. View
4. Events
5. Model
6. Collection
7. Data Source

• Some apps are too small to need building with an SPA framework such as Angular. The simplicity and interactivity of a jQuery-based application can be combined with the well-structured building blocks from Backbone.js to create interactive pages with code organization and structure.

📷 Screenshots

📶 Technologies

• Backbone.js library v1 from CDN
• Bootstrap v5 from CDN
• jQuery v3 from CDN

💾 Setup

• runs from index.html in browser.

💻 Code Examples

EmployeeManager.Views.Employee = Backbone.View.extend(
	{
		tagName: 'li',
		className: 'media col-md-6 col-lg-4',
		template: _.template($('#tpl-contact').html()),

		events: {
			'click .delete-employee': 'onClickDelete'
		},

		initialize: function() {
			this.listenTo(this.model, 'remove', this.remove);
		},

		render: function() {
			var html = this.template(this.model.toJSON());
			this.$el.append(html);
			return this;
		},

		onClickDelete: function(e) {
			e.preventDefault();
			this.model.collection.remove(this.model);
		}
	}
);

🆒 Features

• employees can be added and edited

📋 Status & To-Do List

• Status: Working. Delete function not working
• To-Do: Fix delete function. Delete button commented out

👏 Inspiration

• BackboneJS - Quick Guide
• Auth0: BackboneJS: Getting Started

📁 License

• This project is licensed under the terms of the MIT license.

✉️ Contact

• Repo created by ABateman, email: gomezbateman@yahoo.com