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

Ask HN: What's is your go to toolset for simple front end development?

news.ycombinator.com

Post reply on HN
Print view View original

51–60 of 295 posts

Re: Ask HN: What's is your go to toolset for simple front end development?

#51

Post by anakaine »

shantnutiwari wrote: post #24
davidkuennen wrote: post #5

Honestly? React [0], Tailwind [1] and Vite [2]. Using Vite so setup the environment and tailwind components for css I have never been able to create front end faster than now. It feels like a super power. [0] https://reactjs.org/ [1] https://tailwindcss.com/ [2] https://vitejs.dev/

OP mentioned they are backend developers-- and you are asking them to do a whole frontend setup? Your answer is a bit like "Oh just recompile the Linux kernel if you want feature X, its so easy LOL"

Thanks for taking charge on this one. You've stated my feelings when it comes to doing all the css, javascript and html

Re: Ask HN: What's is your go to toolset for simple front end development?

#52

Post by lucas_codes »

sydd wrote: post #19

React with create-react-app [0] and Netlify for deployment, github as git repo. This way you can have a hello world app that has a full CI pipeline in ~30 mins. [0] https://reactjs.org/docs/create-a-new-react-app.html#create-...

Use vite instead of CRA these days!

Re: Ask HN: What's is your go to toolset for simple front end development?

#55

Post by anakaine »

graboid wrote: post #44

Preact [0] + htm [1] Why? Preact is small, fast, and reasonably easy to use. But the main selling point for me was that, together with htm, I don't need any build system a la webpack. No node_modules folder. I just have to load one script (preact + htm bundled), define my components in plain javascript files and import them. Bliss for me. [0] https://preactjs.com/ [1] https://github.com/developit/htm Edit: Just read…

The drag and drop is more a rapid build tool than anything else. I'm, frankly, not likely to put all the love an effort in to the front end that I will the back end for small projects.

No build pipeline is very helpful, actually.

Re: Ask HN: What's is your go to toolset for simple front end development?

#56

Post by anakaine »

jonnycat wrote: post #30

If you need any kind of interactivity on the frontend, but are more comfortable with the backend, I would suggest looking at Phoenix LiveView [0] or a similar server-rendered HTML technology for your language of your choice [1]. In short, these solutions take JavaScript out of the mix entirely and basically let you deal with a single logical "app", rather than a separate frontend & backend. [0] https://github.com/pho…

A single logical app sounds great. There is great freedom and power in simplicity for small concerns.

Re: Ask HN: What's is your go to toolset for simple front end development?

#57

Post by anakaine »

pavlov wrote: post #50
sydd wrote: post #19

React with create-react-app [0] and Netlify for deployment, github as git repo. This way you can have a hello world app that has a full CI pipeline in ~30 mins. [0] https://reactjs.org/docs/create-a-new-react-app.html#create-...

And if you want a drag'n'drop GUI for this workflow, there's React Studio (macOS only): https://reactstudio.com It outputs create-react-app projects with no extra runtime components or other limitations. You can deploy on Netlify or do whatever you like with the code.

Wish I had a mac sometimes.

Re: Ask HN: What's is your go to toolset for simple front end development?

#58

Post by christophilus »

shantnutiwari wrote: post #24
davidkuennen wrote: post #5

Honestly? React [0], Tailwind [1] and Vite [2]. Using Vite so setup the environment and tailwind components for css I have never been able to create front end faster than now. It feels like a super power. [0] https://reactjs.org/ [1] https://tailwindcss.com/ [2] https://vitejs.dev/

OP mentioned they are backend developers-- and you are asking them to do a whole frontend setup? Your answer is a bit like "Oh just recompile the Linux kernel if you want feature X, its so easy LOL"

It’s really not a huge hurdle. You have to install a few tools. If you’re a backend developer, this shouldn’t be too challenging. And what you get in return is:

Tailwind: CSS done right, in my opinion. If you haven’t tried it, it’s amazing. It’s a no brainer if you’re not great at CSS (which a self-proclaimed backend developer would not be).

React or Preact: it’s much better than cobbling together strings of HTML or using some proprietary template system. You build views with JavaScript and a teeny bit of syntactic sugar.

Vite: I haven’t used, but I do use esbuild which it abstracts. It’s fast, and gets out of your way so you can bundle everything up nicely.

If you add TypeScript to the mix, you now have one of the most advanced compilers in the world helping you catch your mistakes early.

I know it’s popular to bash on front end folks. I’ve been writing front ends, back ends, embedded systems, and more for over 20 years. These tools legitimately solve some gnarly problems and have turned an area I previously hated (web front ends) into one I kinda sorta like (or at least don’t hate).

Re: Ask HN: What's is your go to toolset for simple front end development?

#59

Post by fendy3002 »

plibither8 wrote: post #35
butterfly771 wrote: post #33

Earlier quoted context omitted.

And install React-Router, Redux, set TypeScript

Redux is absolutely not a requirement for "simple" front-end dev. There are many simpler, less boilerplate-y, and more modern ways to manage state in a React application. See https://blog.logrocket.com/modern-guide-react-state-patterns...

Even with up to medium complexities a simple useContext or React.Context is enough.

And with NextJS it makes react state management very scalable and rarely need redux at all IMO.

Re: Ask HN: What's is your go to toolset for simple front end development?

#60

Post by ttiurani »

Sveltekit with typescript and adapter-static.

Sveltekit scales down very well: if you need only CSS and HTML for some paths, that's all you write in your svelte files, and that's also all users download. At the same time if for some other paths you need more Javascript, you can just add it there, without bloating the JS bundle size. Svelte's built-in stores makes it also possible to also do very complex state management, if that's ever a need. With vite under the hood the dev experience is lightning fast.

Post reply on HN