Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Show HN: Open – Free React landing page template

github.com

Post reply on HN
Print view View original

71–79 of 79 posts

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

#71

Post by jwdunne »

moneywoes wrote: post #67
jwdunne wrote: post #14

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 fas…

Thoughts on Gatsby or Next.js for React landing pages?

I’ve not used those to give an opinion on their outputs. But if you can use React in way you produce a minimal, static build of an LP, that’s okay. My main argument is that a sales LP doesn’t need the interactivity React was built to provide.

And if I’m driving paid traffic to an LP, every part of it has to justify itself. Because, otherwise, not only will my conversion rate suffer, Google will charge more per click for a lesser quality landing page.

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

#72

Post by lsalvatore »

jwdunne wrote: post #14

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 fas…

Maybe that's a more productive way for you to work. For those who aren't HTML/CSS purists, we have Gatsby and absolutely no reason not to use React and all its productivity benefits in any and every web project we want, including landing pages. I'm ranking SEO pages and driving paid traffic just fine.

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

#73

Post by seanwilson »

peterangular wrote: post #59
jwdunne wrote: post #49

Earlier quoted context omitted.

There are a number of assumptions here: 1. I’m using that much JS 2. Said JS is spaghetti 3. My split testing tool needs integrating with my ‘spaghetti JS’ 4. I’m creating enough landing pages the overhead of duplicate HTML/CSS is high In reality, if I’m starting out quick: 1. I’ll use little JS because it isn’t necessary 2. The JS I do write isn’t large enough to become spaghetti 3. I’ll duplicate it twice and rethi…

> The most problematic assumption you’ve made is that if it’s not React, it’s spaghetti. This is the biggest problem I keep seeing in the conversation... Tons of people assuming that vanilla JS has to be crap code. In reality, I've worked on MANY well-documented codebases with large JS cores that are custom. Yes some are gross, but some are very simple and easy-to-follow even when I'm 100% unfamiliar with the codebas…

For a typical landing page, you're not going to have a lot of JavaScript code anyway, and each chunk will only be doing a small thing (e.g. analytics, submitting a form) so there's not much scope for spaghetti logic. On a similar note, I'd rather code in TypeScript over regular JavaScript but for a typical landing page it's not worth complicating the build process by adding TypeScript.

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

#75

Post by deftturtle »

peterangular wrote: post #63
deftturtle wrote: post #45

As others have pointed out, you could use a static html page, vanilla js, etc, but ignoring this, I see value for future learning. Sure, there are alternatives, but it looks like the industry wants React skills. I've never used React, and I'm pretty new to web design, so this makes me interested in learning. It's a small project, one which I could modify and study. This is how I got into making my own website. I came…

I mean this 100% in good faith: You couldn't pay me enough money to post a "Controversial Opinions" section to a site that also links to my current resume on the same page. It's best to keep this stuff separate from your professional life.

I've moved it elsewhere, thanks! I didn't mean to upload that page yet, got careless and hadn't refined it.

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

#76

Post by jwdunne »

lsalvatore wrote: post #72
jwdunne wrote: post #14

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 fas…

Maybe that's a more productive way for you to work. For those who aren't HTML/CSS purists, we have Gatsby and absolutely no reason not to use React and all its productivity benefits in any and every web project we want, including landing pages. I'm ranking SEO pages and driving paid traffic just fine.

Again, another React enthusiast assuming I’m a purist. I’m sorry my comment made you froth at the mouth. I’m not a HTML/CSS purist. I made a point of saying that.

What ever works for you but until you can prove that it “works just fine” by showing your organic traffic and cost per click, you’re not convincing anybody. Otherwise, what’s the point in your comment?

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

#77

Post by jwdunne »

seanwilson wrote: post #73
peterangular wrote: post #59

Earlier quoted context omitted.

> The most problematic assumption you’ve made is that if it’s not React, it’s spaghetti. This is the biggest problem I keep seeing in the conversation... Tons of people assuming that vanilla JS has to be crap code. In reality, I've worked on MANY well-documented codebases with large JS cores that are custom. Yes some are gross, but some are very simple and easy-to-follow even when I'm 100% unfamiliar with the codebas…

For a typical landing page, you're not going to have a lot of JavaScript code anyway, and each chunk will only be doing a small thing (e.g. analytics, submitting a form) so there's not much scope for spaghetti logic. On a similar note, I'd rather code in TypeScript over regular JavaScript but for a typical landing page it's not worth complicating the build process by adding TypeScript.

This is exactly what I was trying to say in a fraction of the words :)

I prefer TypeScript. And I enjoy using it with React. But I cannot justify the overhead of the build process and, if react is included in the artefacts, the asset overhead.

The main assumption is that I have lots of landing pages. But I’m commenting on a landing page template, which I can only use on new landing pages. And in that event, I don’t have loads of LPs, I have one, the one I’m building.

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

#78

Post by lsalvatore »

jwdunne wrote: post #76
lsalvatore wrote: post #72

Earlier quoted context omitted.

Maybe that's a more productive way for you to work. For those who aren't HTML/CSS purists, we have Gatsby and absolutely no reason not to use React and all its productivity benefits in any and every web project we want, including landing pages. I'm ranking SEO pages and driving paid traffic just fine.

Again, another React enthusiast assuming I’m a purist. I’m sorry my comment made you froth at the mouth. I’m not a HTML/CSS purist. I made a point of saying that. What ever works for you but until you can prove that it “works just fine” by showing your organic traffic and cost per click, you’re not convincing anybody. Otherwise, what’s the point in your comment?

The point of my comment is to tell you that you're wrong by saying React is not appropriate for a landing page. Gatsby (a static site generator) provides equal or better performance than regular HTML/CSS. You apparently have only heard of Gatsby.

Even though I built my site in React, the end result is minified HTML and CSS. So out of the box using Gatsby and React, I have a faster site than you because I have minification. Of course you can also set up minification. Of course this has nothing to do with React. It has everything to do with what organizations like Gatsby are doing, which is just part of the React ecosystem.

You're scaring people away from adopting the React ecosystem. I'm writing a comment because I need to provide a counter argument for future readers of this thread, not to convince you to use React.

I started blogging on my Gatsby site in January for my business. I get a 98 on PageSpeed and rank for all sorts of keywords. Here's my organic traffic: https://share.getcloudapp.com/RBuv7bWw I'm doing this by myself and I'm happy with results. The idea of switching to writing pure HTML/CSS as some sort of benefit would be completely idiotic to me.

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

#79

Post by doctorOb »

jwdunne wrote: post #14

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 fas…

A number of years ago, I was conducting an interview for a front end developer position. I started with a mostly algorithmic question hoping to gauge the candidate's comfortability with javascript. It was something like “use a for loop and manipulate an array”. They froze up and asked: “can I use jQuery?”. At that point jQuery was at peak ubiquity. Here we had someone reaching for it when the DOM wasn’t even on the table.

I think we’re at that point with React today. It’s become the de-facto way to make a web page, oftentimes for the better. People use it on their complex sites so even for a simple landing page, it’s often the most comfortable tool to work with, despite the fact that it’s adding unnecessary complexity. Fortunately for the user, most of that complexity can be absorbed at build time using server side rendering (the client doesn’t even need to have react if the site is truly static).

It doesn’t matter that you have now moved your HTML into a transpiled javascript syntax that spits out a chain of javascript function calls which generates a javascript object that is then fed into a javascript library that builds an internalized DOM representation and, finally, translates _that_ into an HTML string (which, btw, is happening on a javascript powered server). The browser sees the same HTML + CSS that it might have seen if you had just served them a hand written HTML file over Apache.

For some devs, KISS might actually yield an incredibly complex blob of javascript ecosystem goodies, that is at the same time simpler to setup and get started with than remembering how to structure an HTML file ;)

Post reply on HN