Meteor: JavaScript Full-Stack Application Platform

Full-stack JavaScript framework with real-time data sync and zero-configuration setup for web and mobile apps.

LIVE RANKINGS • 10:20 AM • STEADY

OVERALL

#452

FRONTEND

#42

30 DAY RANKING TREND

ovr#452

·Front#42

STARS

44.8K

FORKS

5.3K

7D STARS

-3

7D FORKS

Tags:

Frontend

See Repo:

Learn more about Meteor

Meteor is a full-stack JavaScript platform that combines frontend frameworks, backend services, and build tools into a unified development environment. It uses a reactive programming model where data changes automatically propagate between the client and server through WebSocket connections. The framework includes an integrated MongoDB database, package system, and build pipeline that handles bundling and deployment. Meteor applications can target web browsers, iOS, Android, and desktop platforms using the same codebase.

Real-time Reactivity

Data changes automatically synchronize between client and server without manual API calls. The reactive system updates the user interface immediately when underlying data changes.

Zero Configuration

Includes integrated MongoDB database, build system, and package manager out of the box. Developers can start building applications without configuring separate tools or services.

Isomorphic JavaScript

The same JavaScript code runs on both client and server environments. This approach reduces context switching and allows for shared validation logic and utilities.

import { Meteor } from 'meteor/meteor';
import { Mongo } from 'meteor/mongo';
import { Template } from 'meteor/templating';
import { ReactiveVar } from 'meteor/reactive-var';

// Create a MongoDB collection
const Tasks = new Mongo.Collection('tasks');

if (Meteor.isClient) {
  // Template helper for displaying tasks
  Template.body.helpers({
    tasks() {
      return Tasks.find({}, { sort: { createdAt: -1 } });
    }
  });

  // Template event handlers
  Template.body.events({
    'submit .new-task'(event) {
      event.preventDefault();
      const target = event.target;
      const text = target.text.value;
      
      // Insert a task into the collection
      Tasks.insert({
        text: text,
        createdAt: new Date(),
        owner: Meteor.userId(),
        username: Meteor.user().username
      });
      
      target.text.value = '';
    },
    'click .delete'() {
      Tasks.remove(this._id);
    }
  });
}