I'm also going to show you how to use `.env` file to setup global variables that you can use throughout your application, be it on your production environment or development environment. That `.env` file is going to hold address to our API that we are going to access through `getServerSideProps()` so that we can SSR our pages, on user request.

After we fetch our data, I'm going to show you how to display it through a Card component, and then style it a little bit so that it looks nice.

In this episode we are going to learn about getServerSideProps() async function in which we are going to fetch our data, and Server Side Render it.

Fetching The Data

In this probably final episode it would be good to put our Sapper, WordPress and Svelte app on line so that it would be accessible everywhere, and I know you guys are probably going to ask me about it ;). So we will deploy our app to Zeit Now and make it be SSR application. So Zeit Now is going to handle server side rendering for us, and our API can be on any old shared hosting you like, it is just a simple WordPress site after all.

In this episode we are going to deploy our WordPress, Svelte and Sapper app to Zeit Now and make it SSR ready.

Deploying On Zeit Now With SSR

In the [previous episode](https://watch-learn.com/creating-svelte-sapper-and-wordpress-website/handling-categories) I told you that our method for retrieving posts from our WordPress REST API was not exactly ideal, because it won't be server side rendered. And we actually want that, so that our site would be more performant and so that we can get all SEO benefits.

So in this episode we are going to refactor our Sapper and Svelte code to make it SSR ready, and that we can reap all of the benefits that we get from that once we put our site online.

In this episode we are going to refactor our Sapper and Svelte code to make it ready for Server Side Rendering or SSR

Tutorials tagged with: ssr

Get in touch