
How to deploy a React app for free - walter12
https://blog.logrocket.com/8-ways-to-deploy-a-react-app-for-free/
======
mburst
So cool to see all the different free services out there for getting in to web
dev. I remember having to do graphic design work growing up to afford a shared
hosting plan on my mom's credit card. Times have definitely changed :D

Lately I've been enjoying KubeSail's
([https://kubesail.com/](https://kubesail.com/)) free tier for playing around
with some SSR things. A lot of the lambda like services don't do great with
doing realtime stuff since they're just meant to run one piece of code then
die a few seconds later

~~~
erulabs
Hey thanks! I’m the cofounder/CTO of KubeSail and this is more or less our
purpose for existing! Our goal is to help people learn - open source tools and
not black boxes - from just learning javascript to bootstrapping a company :)

Thanks so much for the shoutout!

~~~
passthejoe
This is a nice discovery. Thanks!

------
soneca
Great list. My personal choice is Netlify.

With Netlify Functions and FaunaDB (also with a generous free tier), I have a
full stack web app, complete with a database, hosted for free
([https://www.quidsentio.com](https://www.quidsentio.com))

~~~
onion2k
FaunaDB's 50MB/day data output quota is _tiny_ , and they explicitly state
they don't have a hard cap or throttling so if you ever get hugged to death by
a viral HN/Reddit/whatever post it's going to be _expensive_. That puts me off
using it for anything publicly accessible.

~~~
johnmw
Do you (or anyone else) have any other suggestions for good low cost
database/data layer services to work with these options?

These free services are fantastic but the limitation is that they seem to be
only for static sites (static in the sense that there is no data persistence).

~~~
onion2k
Firebase's free tier is enough to run a small startup on. The 1GB database
size is small, but if you're only storing simple structured text records
rather than media it goes a long way.

------
hashamali
It's worth pointing out that most (if not all) the options listed are only
free to a certain point.

Netlify and Github Pages, for example, are capped at 100 GB of bandwidth per
month. It's a very generous cap and ample for most use cases, but something to
keep in mind as your projects gain traction.

~~~
sydd
Yea, they are very useful for small sites. The bigger problem for me was to
find a free backend hosting service, I've only found 3 free and all of them
were pretty limiting: Heroku (the instances go to sleep and take 30+ secs to
wake up), IBM cloud (256MB memory limit), Azure (pretty complicated, need a
credit card for the free tier).

I was looking for a solution where I can host Java Spring/ASP.net toy projects
easily and none of them were satisfactory

~~~
remorses
Check out google cloud run, you can run containers super cheaply

~~~
zadokshi
Do you dare to post the URL of your “super cheap to run” could run instance to
test that theory?

(My point being you’ll need cloud flare DDOS protection or something similar,
and I’m not sure I’d classify that as “super cheap” if we are comparing
against “free”.

Don’t get me wrong, Cloud run is certainly an amazing product, I love it slot.
It is also cheap to run as long as you don’t run into any hiccups. However,
It’s ability to generate a personal $1000 or $10000 credit card bill
disqualifies it from being a good candidate for small to medium projects. It
is clearly an enterprise product.

------
catchmeifyoucan
We've been using AWS Amplify and it's been pretty nice. It allows pairing with
Github and deployments by branches. CI Integrations are not that great, like
Slack bots and stuff, but it gets the job done as a good place to deploy code.
The free-tier is fairly generous, and it's nice that everything lives in AWS
(if you're already using them for other things)

[https://aws.amazon.com/amplify/console/](https://aws.amazon.com/amplify/console/)

~~~
moooo99
Google Firebase offers a similar product called Firebase hosting [1]. They
also offer a fairly generous free tier with 10GB of storage and 10GB of
transfer for the hosting. The free plan also includes SSl and supports custom
domains.

I've been using it to host project websites or single page apsp for a while
and so far it turned out to be the cheapest option.

The CLI is also fairly good so its relatively easy to deploy with a CI system

[1]
[https://firebase.google.com/products/hosting?hl=en](https://firebase.google.com/products/hosting?hl=en)

------
SirHound
I used Vercel for the first time last week and the time between creating a
repo to have a Next site publicly deployed was minutes. A custom domain was a
couple minutes more. I was gobsmacked, this is something that took me weeks
four years ago.

------
ecesena
Great list, I'm glad to see the number of options increasing.

This reminded me of one of my projects,
[http://hasgluten.com](http://hasgluten.com), kind of forgotten but still up &
running on github pages since I learned react 6y ago.

Code is here for the archeologists:
[https://github.com/hasgluten/hasgluten](https://github.com/hasgluten/hasgluten)

------
gempir
I don't recommend Github Pages as they have issues with routing.

Read this [1] for workarounds but it's more than annoying to work around
instead of just using a better hosting solution.

Personally I have only ever tried GH Pages and Netlify had no issues at all
with Netlify.

[1] [https://github.com/rafgraph/spa-github-
pages](https://github.com/rafgraph/spa-github-pages)

------
mvn9
What's the point of using those services over uploading the app files into a
directory that is served by any webserver?

>Render is a unified platform to build and run all your apps and websites with
free SSL, a global CDN, private networks and auto deploys from Git.

Apart from the CDN, that's all available for e.g. Digital Ocean Droplets. But
why would a CDN be needed for static websites?

~~~
anchpop
A CDN is most useful for static sites, no? Since the page content rarely
changes it's easy to cache.

~~~
mvn9
But why do you need it? Being on top of HN with 10,000 visitors doesn't kill a
simple static site. Likewise, a client-rendered web-app shouldn't be too much
for a simple server.

It makes sense to use those services for all the additional stuff, like
Netlify's offers:

>User identity, Serverless functions, Instant forms, Split testing & rollouts,
Analytics, Large media

But for a basic web-app, where's the benefit?

~~~
borgchick
I think it isn't so much about what traffic to a static site will do to a
server, but rather what the experience is for the end user. The tie in to CDNs
help reduce load time for your end user.

~~~
mvn9
Yet web-apps are made to not be bothered by load-times. Web-apps are cached by
the browser. Once downloaded, startup-time should be instantly.

And downloads shouldn't take too long. Basic 1Gbit connections give you
100Mbyte per second, 10M per 100mils. A landing page should be doable in 10M,
and then there is at least one second left to load the rest of the page before
the user can react and make a choice.

~~~
amenod
The problem is more about latency, not so much bandwidth. Also, not everyone
has a good connection.

Cache only works the second time the user comes to your page. By definition,
every user will experience slow loading the first time.

That said, it probably depends on your use case if it is worth bothering with
a CDN or not.

------
sergiotapia
Netlify is one of the best services my team uses. It does exactly what you
expect it to do and then gets the fuck out of your way. I love it!

They also have smart features baked right in like pre-rendering. Literally hit
a checkbox and you're prerendering.

------
josep-panadero
It is fantastic how far we have gotten. I had a web in Geocities before the
Yahoo purchase. It allowed 150 Kilobytes of storage and no CGI (Common Gateway
Interface).

I do no see mention of size limits in the article. I just checked Firebase and
the free tier allows up to 1 GiB total.

Security is the other change. To run CGI allowed control of too much for any
provider to be comfortable with it. Containerization and overall Operating
System improvements allow for server-side code with safety (Spectre aside).

Great article and great opportunity for anyone that wants to start small on
the cloud.

------
ecmascript
I have always disliked services like netlify or vercel. Sure it seems nice
with free hosting but in reality it's quite limiting and often it's cheaper to
host on a $5 DO droplet or some similar vps offering. Also, with those kind of
services that are free, soon gets very expensive as soon as you leave the free
tier.

With a vps, you can do front and backend and host hundreds of low traffic
websites.

I don't really understand what type of developer only does front end work or
where do you host your backend stuff whjen you use Vercel / Netlify?

~~~
nikon
Couple of reasons why you'd pick one of these services over a $5 DO droplet:

\- Maintenance (zero)

\- Auto deployment

\- Global CDN

\- Serverless functions can deal with spikes automatically, but cost zero when
idle

~~~
ecmascript
Yeah I get that, it's a fair reason to choose serverless stuff before a VPS
and I understand why people do it.

In fact, I understand it enough and have felt the pain enough that I am
actually working on a project that will help solve several of these issues for
traditional server hosting. The only thing it won't have is a global cdn but
that could potentially be added in the future as well.But I think a CDN is not
needed for most projects actually and my service will focus on smaller to
medium sized projects.

[https://deployjs.com/](https://deployjs.com/) \- but it's pretty far from
even reaching an alpha release :)

------
wtphilip
Great list! Thank you for putting this together. Highly appreciated. What
about way 9: [https://stormkit.io](https://stormkit.io)?

~~~
walter12
This is new to me :) I would have added if I knew of this. Maybe next year I
will try to update this post and try to get the number to 8

~~~
wtphilip
If only I had known you were writing the article ;) I am curious to hear what
you'll have to say about it.

------
emersonrsantos
Very nice free service list. I think it could been added a way of running node
CLI’s without installation through npx instead of installing global packages.

~~~
walter12
Thanks and That's a very good feedback,

------
azangru
The word "React" in the title is irrelevant and clickbaity. "X ways to deploy
a static site" would have been more appropriate.

~~~
amenod
Disagree - some advice is specifically tailored to React apps (created using
create-react-app).

------
aussieguy1234
I use Netlify for [https://expose.sh](https://expose.sh)

It's configured to auto deploy from GitHub every time I merge to the "master"
branch.

Works pretty well for my static site and it's free because I'm a solo founder
therefore there's only one team member.

------
Pandabob
This is kind of Off-topic, but I've been getting back to doing web development
for the past few months. One thing I've been surprised is how much high
quality content marketing/blogs there are especially regarding React.

The Logrocket blog is an excellent example of this. Lots of useful blog posts.
Another one I've been relying on is the blog of Robin Wieruch [1].

I guess stating this is a little obvious, but one of the upsides of using
popular tools is the productivity boost you get from the surrounding
ecosystem.

[1]: [https://www.robinwieruch.de/blog](https://www.robinwieruch.de/blog)

~~~
sushshshsh
Really questioning this. The things available in vanilla js, html5 and css3
are immensely powerful and extremely well documented for those who care to dig
into it

~~~
koonsolo
You are correct that those have a pretty good interface.

But here is some advice from an old programmer: once you start making bigger
and more complex projects, you will start to make your own convenience
libraries. And soon you will realize that you've built your own React-like
library. But only less stable and less well thought out, because react has the
huge community and maturity.

But if you only do some small functionality, or something specific with the
technology, vanilla is perfectly fine.

However, if you are a single page app coder, I would definitely go for
something like React.

~~~
rimliu
Not everything has to be built with React, and the size of it is orthoganal to
the technology.

If fact, huge projects are likely to suffer from using React, because virtual
DOMs get out of hand and a lot of resources a wasted by building and
rebuilding VDOM and looking for the changes.

Also, for some reason, React brings a lot of cargo-culting. Many don't stop to
thing whether they should even if they can. They bring React, then they bring
Redux, then all the rest is being dragged in and you get multi MB bundles for
some truly trivial purposes. Of course, that's more on developers than on
React, but it happens way to often. And for some reason just bringing React
and Co. is not enough, it usually ends up in some imressive architecture
astronautics. At the end you have a project that is big, but slow and still
impossible to understand because the levels of indirection are off the charts.

~~~
varrock
I'm not going to say you're wrong, because I don't have claim to back mine up,
either. So, this is for the sake of discussion.

The sentiment that everybody reaches for Redux is tired, in my opinion. After
following many in the web development community and keeping up with online
forums such as this, it's fairly clear to me that people have moved on from
the heavy armor previously associated with React if they have a choice. For
instance, people learned that they were using Redux for prop drilling, which
led to many switching over to the context API natively from React. Another
good example is Gatsby, for those who realized they have a static site and
would like to address the SEO issues associated with a SPA.

Also, a lot of times, companies adopted React and Redux before the inception
of these new, more powerful libraries that are obvious choices on the ground
as of August 2020. But, have fun refactoring your entire client side state
seamlessly if you're tracking state more sophisticated than the status of the
application sidebar.

------
juskrey
vs "How to earn $2.5 a month to deploy your apps the way you want"

------
timmit
I like vercel/zeit, and dislike firebase

~~~
riffraff
Your comment might be interesting if you could explain why you like and
dislike them, but as it is it's not very useful.

~~~
timmit
Oh, I did not realised that explaination is required.

Reason:

Zeit is very easy to use, you do not even need to config your workflow, and
FaaS and multiple framework are well supported.

Firebase, it belongs to Google, there is no doubt Google will limit the free
tier and charge you more in the next a few years.

