Backend/big data guy paralyzed by frontend choices

Front-end development can be overwhelming these days. I'd honestly just throw down some money on a paid starter kit that has everything you need (auth, data fetching, prebuilt UI, etc). The benefit there is you can learn at your own pace by exploring the code, but easily just skip to working on your actual custom features to get to MVP faster. Divjoy might be a good starting point for you (disclaimer: my product). There are also others like saaspegasus.com and bedrock.mxstbr.com.

My partner and I, after oogling over many a front-end solution over many product ideas, finally just stuck with Bootstrap with server-side rendered templates. Gets you going, if you need to grow past what it can offer then that's a bridge you can cross later. Loads of documentation and premade layouts out on the web.

Validate your concept with something tried and true, theme it to the products complementary brand colors (there's sites that will show you great complimenting color palettes, and let it rip – it's okay to scale past the templates into something like React later on when you see the need.

Think about using Hotwire, especially if you are on Rails. LiveView if you are on Phoenix.

It doesn't make much sense to go the React rabbit hole if you are primarily backend dev and need to get up and running.

The problem what you facing is similar to what I often answer as a freelance architect. Its a frequent request for me to design a system which can make a team of strong backend engineers to build a stable UI.
Around 50% of my work is UI, not just simple text, buttons, textboxes, but also complex and heavy data presentation in 2D charts ( https://www.dragonever.com/wp-content/uploads/2021/04/C3-01.gif ).

There are few important things which need to be considered. Are you looking for a simple frontend to present/control the backend? how much of your work is frontend? Do you have complex data presentation ( 2D charts, etc). Do you need to display live data? websockets? Do you already have developers with javascript experience?
These are some of the questions which help you answer in selecting framework.

Lets say you have a super simple web UI, its a waste of time to go for ReactJS or Angular. If you have a decent complexity in UI, frameworks like React will greatly help in long run (especially in long run when more than one developer working on it). Also lets say you are need to make modifications after few months or year, ReactJS/Angular greatly help because code is cleanly divided into sub components.

Some of the worst mistakes I have seen is adding unncessary complexity like graphql for simple projects.

If you are developing a general user facing app, TailwindCSS will saves you time. CSS is often frustrating (UI development is not as clean and structured as backend). For enterprise projects I dont use Tailwind, I suggest things like fomantic-ui.com not only because they are stable and quick, they come with lots of readymade components (from the same source).

For my own ReactJS projects I often go with Divjoy.com . With in an hour I can have very clean ReactJS project with a simple landing page, payment (stripe), other pages. If you go with Tailwind I recommend buying TailwindUI.com paid components.

Feel free to ask if you have any questions.

Fellow data guy who was/is in your shoes. A few of my thoughts:

• Just pick a top 3 framework and run with it. I choose to use React for Wait, What Do You Do? and any time I have wanted to add something to it Google has had more than enough results to walk me through adding.

• I'm not sure what you are building but, most, if not everything, you are trying to do has been done many times before. Look for an example and copy what they did.

• DO NOT WORRY ABOUT BEST PRACTICES. Focus on writing code that does what you want it to do. If you look to have the best code for everything you write, you will be stuck before you start. That said, comment the living fuck out of it.

• Try to get something running as soon as possible. It is much more fun/rewarding/less soul crushing to have something to look at that you can say "i made that"

• Style is always subjective. Perfect is the enemy of good enough.

• Did you write front-end code? If so, now you are front-end developer. Not only that you are better at it than 99.999% of everyone else in the world

Good luck with everything and stick with it because it is incredibly rewarding to learn something that had been total alien. Feel free to dm me if you ever want to talk shop.

But now, I'm paralyzed by studying available frontend choices and by the fear of choosing badly and wasting even more time.

If you're in the early phase and testing things out, I'd say for the most part you can just pick anything. Your choice in the front-end framework/component-kit isn't going to be the make-or-break in your product.

I think the most important thing is that whatever you end up choosing needs save you time. So any component kit wins huge compared to creating your own design system.

If you can get away with using server-side rendered templates, there’s not much harm in doing that.

But, how to go about choosing the best frontend framework? Definitely choose one of the big 3—react, vue, or angular. Of those, react has the largest community and support. With experience in both react and vue, I can definitely say that react has more production practices and enterprise features baked in too. Since react is only a library, you’ll need to pick a framework to go with it. Next.js is by far the best one for the job, and will continue to lead for the near future. For components, the most popular for react are Material-UI and Tailwind CSS (with the accompanying Tailwind UI). I would recommend using TypeScript with your frontend framework for autocomplete and significantly easier refactoring. After that, just build. You’re just you, so digging into storybook, trying bleeding edge frameworks like svelte, or trying to build your own component library are out of scope.

Learning that takes a substantial amount of time—worth doing if you have it. But, it’s easy to forget that the best tools are usually the ones you already have (especially on limited time or budget).

VueJS 3.0 with TailWind and Typescript.

If you are just trying to get up and running to validate an idea maybe check out PyWebIo. It is great for quickly building pages and forms to collect and display data. You can check out this video to get started.

https://www.youtube.com/watch?v=n6I58WJiKGU

Disclaimer: I am not the creator of the package, the video, or am in anyway associated with the dev team bedsides being a fan.

Hey @robitx, you might be putting to much pressure on your shoulders 😅 , but as an entrepreneur I feel you...😉

When I jumped into the world of entrepreneurship and try to learn to code to build my first app in 2008 I felt paralyzed to. Something that really helps me to choose the best tools at this moment was to select the top 3 most used tools and pick from the list the one that seems to fit me the best (it does not have to be a rational feeling, I think it might be whispered by your gut).

To come back to the topic of frontends tools : IMHO if you pick one of the 3 most popular javascript frameworks (React, VueJs, Angular) you can not make the wrong choice. These frameworks have such massive community that it will fit your needs.

And if your question is how to choose today the perfect tool that will a hundred percent fit your needs, I think that it is impossible. Because no matter what tool you choose, you will have some issues that you can not anticipate before to go on the road of building your product ;)

Wish you the best !