Deploying a Next.js project on SashiDo
Tags: javascript, react, tutorial, webdev
Published: 2020-08-28 15:10:17

You’re planning to build your first or your yet another content dense web site then the [Next.js](https://nextjs.org/) framework is probably one of the top choices to go with. I know that because just like you, our team likes building big projects, we like to build them fast and we think Next.js is super cool! So in the next lines, I will show you how to start using Next.js and deploy your new project on [SashiDo](https://www.sashido.io/en/) effortlessly. 

## A flying start for your Next.js project on SashiDo!

Surely there are lots of ways to deploy your project, some of them are even free. But let’s be honest here - you’re not looking just for free hosting as with projects that are expected to have massive content piles stacking up there are quite a few things you’ll need along the way.

It’s awesome that Next.js gives you a nice package of ready-to-use stuff, so how about making the list even longer by adding **Database + Automatic Backups, REST & GraphQL APIs,  scalable file storage for user-generated content with built-in CDN, CRUD, Auto-Scaling, SDKs, User Management + Automated Emails, Background Jobs, Web Hooks** and more?

![Alt text of image](https://media.giphy.com/media/FYSW3c4eJb6G4/giphy.gif)<p><center><a href="https://giphy.com/gifs/adam-lambert-queen-kiev-FYSW3c4eJb6G4">via GIPHY</a></center></center></p>

Want to get it all? Let me show you how you can kick off your app by simply cloning the boilerplate that our React-loving team has created. 

## How does this work?

The project our team created is developed as a [Next.js boilerplate for SashiDo applications](https://github.com/SashiDo/sashido-nextjs-boilerplate). 
SashiDo’s platform allows the implementation of server-side logic and has a built-in Express, which is directly mounted to the server. We use Express for handling the Next.js and you may find the respective logic at [`cloud/app.js`](https://github.com/SashiDo/sashido-nextjs-boilerplate/blob/master/cloud/app.js#L18).

## Installation

In case you’re new to SashiDo, as a first step have a quick look at our short [Getting Started Guide](https://blog.sashido.io/sashidos-getting-started-guide/). There you’ll find all the base steps that will ensure your new app will be on the fastest way to production. But if you’re already a happy customer, just make sure you keep your local environment as close as possible to the production one before you begin with the installation of the project.

I’m going to keep this short and sweet, so let’s get started: 
### 1. Clone the repo
```
git clone https://github.com/SashiDo/sashido-nextjs-boilerplate.git
cd sashido-nextjs-boilerplate
```
### 2. Install Dependencies
```
npm install
```
### 3. ENV Variables
`DATABASE_URI` - Default: 'mongodb://localhost:27017/dev'
`APP_ID` Default: 'myAppId'
`MASTER_KEY` : Default: ''
`SERVER_URL` : Default: http://localhost:1337/1'
`PORT` : Default: 1337

### 4. Development
```
npm run dev
```

If everything is okay you should see an output similar to this one:
```
Running on http://localhost:1337
info: Parse LiveQuery Server starts running
Defining routes from exportPathMap
[ ready ] compiled successfully

```
### 5. Go wild and unleash your Next.js creativity into the `./src` folder.

### 6. Open http://localhost:1337 in your browser and see the changes :)

## Deployment into production

Add your new SashiDo app as a remote branch and push changes.

```
git remote add production git@github.com:parsegroundapps/<your-pg-app-your-app-repo>.git
git push -f production master
```
## Bonus goodies
Deploying a successful Next.js project is not only the kicking off part, so we made sure you’re well equipped for the next steps too. On SashiDo it is not only easy to [host and publish static websites](https://blog.sashido.io/sashidos-getting-started-guide-part-2/#websitehostingonsashido), but you can also manage custom domains directly from the dashboard, have a **private GitHub Repo**, **collaborate** with as many people as you like, and set up a **free SSL certificate** with just one click. And let’s not forget about **scalable file storage for user-generated content with built-in CDN** which is offered as a ready-to-use feature. All this for less than a cup of coffee per month. No wonder why Next.js and SashiDo make such a good match!

## Technologies

 **[SashiDo.io](https://www.sashido.io/en/)** - a fully-managed serverless API development platform built with Node.js, MongoDB, Kubernetes, and Doker. SashiDo is currently powering 19k+ Parse apps, 110M+ end customers, and 225 million devices accessing the apps all over the world. 
 
**[Next.js](https://nextjs.org/)**  - a great JavaScript framework that lets you easily build a complete web application with React and server-side rendering. People usually fall in love with the technology because you can have an app running as quickly as your computer can install the required packages...seriously.

## Fin
That was beyond easy, right? You can thank me in comments or by sharing your awesome ideas in a pull request. 😜

Happy coding!