DEV Community

Cover image for Meteor v3 uses express under the hood – How to use and deploy it.
Gabriel Grubba for Meteor

Posted on

Meteor v3 uses express under the hood – How to use and deploy it.

If you have never heard of Meteor, here is a blog post from @harryadel in which he tells a little bit about the genesis of this 10-year-old framework. Also, check the About section in our docs.

As you might have seen from this PR and in our forums Meteor v3(it is still in beta, but you can follow the progress here) will be released with a new engine, expressjs.

This blog post focuses on how to use and deploy meteor v3 and test this new engine. You can check the final code in GitHub

Table of contents:

Why use Express with Meteor?

You might wonder why Express can be used with Meteor if Meteor provides everything that is needed to connect with the front end. For the cases where it is required to expose data to another client or multiple clients, for example, you have a dashboard that is your Meteor app, and you have clients that can consume that data. You can use Express for this case and provide an HTTP endpoint.

Meteor installation

You can check the meteor installation section in our docs for more details and troubleshooting in case of installation problems.

Having Node.js v14 in your machine run:


npm i -g meteor

Enter fullscreen mode Exit fullscreen mode

Or using curl if in OSX or Linux:


curl https://install.meteor.com/ | sh

Enter fullscreen mode Exit fullscreen mode

Creating your app

Having meteor installed on your machine, you can create your app running the following command:

meteor create 3.0-beta-app --release 3.0-beta.6
Enter fullscreen mode Exit fullscreen mode

This command will create a meteor app in the 3.0-beta-app folder. To enter this folder, run cd 3.0-beta-app.

Temporary issue

Before starting our app for this release, we had an issue with react-meteor-data. To solve it, run the following command:

meteor remove react-meteor-data && meteor add react-meteor-data@3.0.0-beta300.1
Enter fullscreen mode Exit fullscreen mode

You should see a result like this one:

CLI result

Having all our dependencies installed and all is okay, if you run the command meteor in the root of your project, you can see in localhost:3000 this page:

base image page

Working with express

To start using Express in your project, you should add this import in the server/main.js file:

import { WebApp } from "meteor/webapp";
Enter fullscreen mode Exit fullscreen mode

This interface is where you can register your endpoints.

You can use the WebApp.handlers as your express instance as you typically would. For example, this is how we create a GET endpoint that returns all links from the LinksCollection, the end result should look like this in your server/main.js file:


import { LinksCollection } from "/imports/api/links";
import { WebApp } from "meteor/webapp";

WebApp.handlers.get("/all-links", async (req, res) => {
  const links = await LinksCollection.find().fetchAsync();
  res.json(links);
});

// other code ...
Enter fullscreen mode Exit fullscreen mode

If you check your app in http://localhost:3000/all-links, your page should look like this:

JSON payload

And that is all you need to have your app running and using Express.

Deploy

The easiest part is deploying; you can use the Meteor Cloud for free to test your app.

If you host your project in any Git provider(GitHub, for example), you can use this tutorial to deploy your project, and when you commit a new change, it will deploy a new container for you.

In this tutorial, I will use the CLI for simplicity. In the root of your project, run the following command:

meteor deploy mycollexpressapp.meteorapp.com --free --mongo
Enter fullscreen mode Exit fullscreen mode

When you are deploying, you should change mycollexpressapp.meteorapp.com for a URL that you like

When you deploy your project, you can access https://mycollexpressapp.meteorapp.com/all-links, and all your links should be there in a way similar to what we have locally.

Conclusion

Given what you have seen today, I would love to see what apps you can create using Meteor v3 and Express.

Please ping us on X(formerly Twitter) with your project; we would love to showcase it.

Top comments (1)

Collapse
 
nigel447 profile image
nigel447

great to see meteor evolving, good resources here ++