Show HN: Open – Free React landing page template • Hacker News Board

Re: Show HN: Open – Free React landing page template

#11

Post by ahmedfromtunis » Thu, Apr 16, 2020, 2:14 PM UTC

Thank you for open-sourcing this and sharing it here. I'm sure a lot of people would find this useful.

That said, I wouldn't recommend for people looking for readymade landing pages to use React (or any other such framework) UNLESS they're already familiar with it. Otherwise, it would be a waste of their time -- setting up the development environment and then deploying it.

For such a case, it'd be better off writing some HTML and CSS by hand (maybe with some help from Bootstrap or any other such framework), push it to some git repo and throw it at Netlify. It's easy and free.

Now, this is obviously just my opinion. So, please don't feel obliged by it in any way. However, I'd be glad if someone just told why I might be mistaken; and how React would make for a great choice for this kind of projects?

Again, OP, thank you for sharing this with us!

Re: Show HN: Open – Free React landing page template

#12

Post by IceDane » Thu, Apr 16, 2020, 2:19 PM UTC

oscarteg wrote: post #5

Using React is really bad for your SEO. If you want to use React, use something like Nextjs or Gatsby to compile it into a static HTML website.

Citation needed.

Google bot runs JavaScript these days. I'm sure proper SEO is possible in the worlds most popular UI framework.

Re: Show HN: Open – Free React landing page template

#13

Post by spyke112 » Thu, Apr 16, 2020, 2:21 PM UTC

nullandvoid wrote: post #6

mosselman wrote: post #2

Why react?

Why not? It's the most popular UI framework. The second you start building a SAAS product on top of those pages, you're not going to want to be in vanilla land.

Uhm, probably not the best idea to mix your saas application, with your business website. I would definitely not recommend that.

And i will also echo the other comments, saying that this is definitely overkill. If you're doing a single landing page, jsut go with static html/css. If you need some content management, then either go with a fully fledged CMS or do the hipster thing and compile into static site.

Re: Show HN: Open – Free React landing page template

#14

Post by jwdunne » Thu, Apr 16, 2020, 2:22 PM UTC

This is not a good use case for react. At all. A landing page should do one thing and one thing well: drive an action. The less distracting interactivity the better. The only thing you want interactive are your CTAs. The overhead of using React, even if using a static site generator, isn’t worth it. Not when you can whip up a simple HTML/CSS page in less time that’s far far easier to build and deploy. Because the faster you get it out, better. The less time between TTFB and full interaction, the better. Otherwise you’re wasting time and ad spend.

And don’t get me wrong, I like React. And the projects have used it on have impressed clients beyond what we could achieve with just using backend HTML templates. But for a landing page that you’re driving paid traffic to? Not a good use case at all.

Re: Show HN: Open – Free React landing page template

#15

Post by have_faith » Thu, Apr 16, 2020, 2:23 PM UTC

oscarteg wrote: post #5

Using React is really bad for your SEO. If you want to use React, use something like Nextjs or Gatsby to compile it into a static HTML website.

I've built API powered React sites with almost no consideration for SEO that Google has indexed without issue. My experience has been that as long as the API requests for content are quick Google is happy to wait and index correctly as expected. YMMV obviously.

Re: Show HN: Open – Free React landing page template

#16

Post by leerob » Thu, Apr 16, 2020, 2:25 PM UTC

IceDane wrote: post #12

oscarteg wrote: post #5

Using React is really bad for your SEO. If you want to use React, use something like Nextjs or Gatsby to compile it into a static HTML website.

Citation needed. Google bot runs JavaScript these days. I'm sure proper SEO is possible in the worlds most popular UI framework.

Single-page apps (SPAs) using client-side rendering (CSR) like React do get indexed by Google, it's just not instant. Depending on how long it takes for the content to load, the Googlebot might not be able to figure out the correct on-page SEO.

If SEO is a critical requirement, I'd recommend either server-side rendering (SSR) through a framework like Next.js or completely static sites through whatever framework you prefer (Next.js, Gatsby, 11ty, Hugo, Jekyll, etc, etc).

Re: Show HN: Open – Free React landing page template

#17

Post by protonimitate » Thu, Apr 16, 2020, 2:25 PM UTC

arnaudsm wrote: post #9

What's the advantage of using React for a landing page that could be a 10KB static HTML file ? (non-sarcastic question)

I'm seeing 714kb of data loaded over 924ms.

Not as small as possible, but I don't think this really qualifies as bloat.

Imo the benefits of using React boilerplate for a landing page would be: - Quick to set up / customize (faster than starting from scratch in vanilla js, anyway) - Flexible. Allows devs to quickly pivot the landing page into a "landing page + [whatever]" if needed

If pure speed to load is your endgoal, then go with a static page. However, I think a vast majority of users won't notice and/or care about the small difference in speed or "bloat".

I guess to flip the question, what's the benefit of using a static HTML file over React, other than a 10kb footprint?

Re: Show HN: Open – Free React landing page template

#18

Post by hobonumber1 » Thu, Apr 16, 2020, 2:26 PM UTC

arnaudsm wrote: post #9

What's the advantage of using React for a landing page that could be a 10KB static HTML file ? (non-sarcastic question)

You can use server-rendered React. You get the benefit of having components without the cost of downloading React on the frontend (unless you have something interactive). This is what NextJS does.

Re: Show HN: Open – Free React landing page template

#19

Post by [deleted] » Thu, Apr 16, 2020, 2:27 PM UTC

have_faith wrote: post #15

oscarteg wrote: post #5

Using React is really bad for your SEO. If you want to use React, use something like Nextjs or Gatsby to compile it into a static HTML website.

I've built API powered React sites with almost no consideration for SEO that Google has indexed without issue. My experience has been that as long as the API requests for content are quick Google is happy to wait and index correctly as expected. YMMV obviously.

[deleted]

Re: Show HN: Open – Free React landing page template

#20

Post by a_wild_dandan » Thu, Apr 16, 2020, 2:28 PM UTC

arnaudsm wrote: post #9

What's the advantage of using React for a landing page that could be a 10KB static HTML file ? (non-sarcastic question)

Extensibility. We may begin with simple hero image/call-to-action, but we might wind up with a sign up form with validation, a interactive map of office locations, maybe even fancy particles (who doesn't love particles!?[1]), etc.

The page load will be fast enough to dissuade no users, I can add server-side rendering & free code-splitting (e.g. Next.Js), etc. Seems like a good deal.

[1] https://vincentgarreau.com/particles.js/