Frontity Tutorial
  • 👋Welcome
  • ✔️Checking your progress
  • 1️⃣ Creating a custom theme
    • Create a Frontity Project
    • Create a Theme Package
    • Modify the <Root> component
    • Connect the <Root> component to the state
  • 2️⃣ Adding a menu
    • Use the <Link> component
  • 3️⃣ Displaying posts
    • Understanding the Frontity state
    • Display the list of posts
    • Display the post content
    • Display posts and pages separately
    • Formatting the date
  • 4️⃣ Adding styling
    • Global styles
    • Styled components
    • Styling the links
    • Styling the post info
    • Add dynamic styling
  • 5️⃣ Adding behaviour
    • Use 'state' and 'actions'
    • Add pagination
  • 6️⃣ Custom Post Types
    • Add support for Custom Post Types
  • 7️⃣ Finishing touches
    • Add a <Loading> component
    • Add a 404 page
    • Use the <html2react> component
    • SEO and head tags
    • Other things to do
  • 8️⃣ Deploying the project
    • Deploy to Vercel
  • 9️⃣ Next Steps
    • Learning resources
    • Getting help and support
    • Contributing to Frontity
Powered by GitBook
On this page
  • Create an account
  • Deploy your site
  1. 8️⃣ Deploying the project

Deploy to Vercel

Previous8️⃣ Deploying the projectNext9️⃣ Next Steps

Last updated 4 years ago

Vercel is a cloud platform for static sites and Serverless Functions. It enables developers to host Node.js based projects simply and with minimal configuration required.

We highly recommend Vercel for hosting your Frontity site as it is serverless, cheap, includes a CDN, and is very easy to set up.

It also supports the cache technique stale-while-revalidate (they call it Serverless Pre-Rendering). This is a powerful way to improve your site speed.

Create an account

In order to be able to deploy your site to Vercel you need to have an account. You can to create your Vercel account.

Once you have an account you to Vercel from the terminal.

> npx vercel login

After following their security process you will be logged in in your browser. Keep this browser tab open for the time being as we'll be referring to it later.

Deploy your site

Before you can deploy your site to Vercel you will need to create a file called vercel.json in the root of your Frontity project. The file should contain the following code:

{
  "version": 2,
  "builds": [
    {
      "src": "package.json",
      "use": "@frontity/now"
    }
  ]
}

Once the file is created you can deploy your project from the command line using this command:

> npx vercel

You'll be asked a short series of questions about your project:

Then, after a brief build process your deployed site will be ready. The address that you can use in your browser's address bar to reach the site will be displayed in the output from the command, and also in the Vercel console in your browser (which you kept open, didn't you?!).

Deploying to Vercel

For more information on deploying to Vercel, including how to use your own domain, see our "" documentation.

signup here
login
Deploy to Vercel