Git Product home page Git Product logo

andrewp-me's Introduction

Remix Starter for Vercel

Welcome to Remix!

This is a starter repo for using Remix with Vercel.

Development

After cloning the repo, rename .npmrc.example to .npmrc and insert the license key you get from logging in to your dashboard at remix.run.

Note: if this is a public repo, you'll probably want to move the line with your key into ~/.npmrc to keep it private.

Then, install all dependencies using npm:

$ npm install

Your @remix-run/* dependencies will come from the Remix package registry.

First Run

The start script in this project starts a few processes, one of which is vercel dev. On your first run, however, you'll need to run vercel dev alone to get it set up with Vercel.

$ vercel dev

Follow the prompts, and when the server is started, end it with control + C.

Now whenever you're developing you can use the normal start script:

$ npm start

This will start the Remix development server, a TypeScript watcher for your server code, and the vercel development server.

Note: In production the Remix asset development server and TypeScript watcher aren't used.

Deploying to Production

Before you can deploy to production you'll need to turn on "System Environment Variables" on your Vercel app. Log into Vercel and navigate to the app's settings environment variables page:

https://vercel.com/<vercel user name>/<name of your app>/settings/environment-variables

Check the box that says "Automatically expose System Environment Variables". More info here: https://vercel.com/docs/environment-variables#system-environment-variables

Then you need to add your Remix token to your environments:

$ vercel env add plain NPM_RC development < .npmrc
$ vercel env add plain NPM_RC preview < .npmrc
$ vercel env add plain NPM_RC production < .npmrc

Once that's done you can deploy!

$ npm run deploy

Note: Typically Vercel builds your app for you when you run vercel, but it chokes on TypeScript files and we don't know how to tell it to ignore them. We find it simpler (for now) to just run the build yourself before deploying and telling Vercel to not worry about building for us (you can see in package.json the vercel-build command is empty).

Documentation

Detailed documentation for Remix is available at remix.run.

andrewp-me's People

Contributors

droopytersen avatar

Watchers

 avatar  avatar

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.