The problem with every single project has been that while I make quick and great progress on the areas I'm familiar with, they all get stuck when I have to dive into client side work – web pages, JavaScript, mobile apps or whatever else. Even the most basic versions seem like a chore and I inevitably give up.
I have brainstormed three ways forward:
– Pay someone else to do it - likely to be too cost prohibitive considering they are just hobby projects.
– Find a co-founder/partner with those skills - I have no idea where to look, and am wary of forming any kind of professional relationship at this stage again considering these aren't businesses but just something I like to work on on the side along with my day job.
– Use no-code app builders and other similar tooling - this option seems to be the most intriguing, but not an area I am too familiar with. Has anyone had success with building an MVP using these?
If someone could share their own tips and experiences with the above, or something I am missing, I would love to hear it.
I spent a lot of time digging into the Javascript ecosystem trying to find a framework that I actually enjoyed using. There just weren't any. I've come to the conclusion that I just really don't enjoy working with javascript (and related tools, languages, etc) at all.
I've had a lot of fun with Flutter, though. Here's a quick overview if you're not familiar: https://www.youtube.com/watch?v=lHhRhPV--G0
It's easy to get started, there are numerous learning resources out there (I really liked https://appbrewery.com/p/flutter-development-bootcamp-with-d...), and it's opinionated without being opaque. You can install the SDK and have a hello world app up and running in like 5-10 minutes (including tight VS Code integration, hot reload, etc -- all of that stuff works out of the box). You still have to think about responsive design and state management and stuff like that, but it's not too difficult to reason through it even if you don't have any prior frontend experience. It even comes with a library of pre-styled components (Material Design) that you can just _use_ without having to make decisions.
People are going to complain about a ton of things about Flutter, but I encourage you to give it a go (if for no other reason than it's a good example of opinionated, powerful tooling that you can just _use_ without having to fiddle with it).
Bonus, using ai to write css is much quicker than combinatorially trying every css layout option like I usually do since I never remember that stuff.
Make tech and project decisions that minimise the importance of a front end. For example an api is something you can launch and make a business out of. You can also make a business where instead of selling people software they use to do X, you do X for them using your software. Or take a look at Midjourney. Huge deal in AI generated images and their "frontend" is a Discord bot gated by a Stripe payment page.
Instead of spending a lot to pay someone else to do it, consider paying a little bit to make it easier for you to do it. Shell out for the premium library, third party api, theme, etc that makes getting your front end done just that little bit easier.
Ok a bit tongue in cheek :P But honestly for most things you can use a web server in a language of your choice and spit out HTML. For the HTML design there are templates and frameworks responsive out of the box (bootstrap etc). If you need any in-page wizardry there are well documented javascript libs you can drop in. This approach still works for most applications.
Hotwire can be used outside of rails.
And LiveView is a similar framework from the elixir/Pheonix community (and probably now available for other languages).
Modern front end isn't that compelling to me but at least there's a lot of tooling to make something OK quickly. I just picked something with a good tutorial (sveltekit and tailwind) and it got me to a good enough point.
You also probably need the whole account signup/login flow, billing, and other fun things, which generally need their own UIs. There there are more options, like using the Amazon Cognito UIs, but it still tends to be surprisingly involved.
If you can already code you can probably fake it til you make it and learn yourself.
P.s if you just want to shoot your ideas past someone, maybe get a little help figuring out where next with a frontend, my sites in my bio, feel free to say hi.
If it does, and if the binary sizes aren't too large (both can be a problem for some languages) then you might be able to create your frontend using wasm, using your preferred backend language.
Similarly I’ve been doing a lot of GUI work work recently. I’m also a back end person. I’m also not very detailed person. So, GUIs aren’t really my game. My work is desktop JavaFX, not the web, however.
But, at some level, a UI is a UI when it comes down to bringing it to life.
If there’s anything I can convey to make it easier, I think the singular concept important to a solo GUI project is momentum. GUIs are a grind.
Similarly, though, “seen one, you’ve seen them all”. But as someone starting out, you haven’t seen any. That’s why once you get moving, it can go much faster, as you just keep repurposing and copying stuff you’ve already done.
To get there though, you just need to start. Take a bit of time to sketch out, say, 5 screens that try and capture a good chunk of the functionality you like. A CRUD screen, a status page, simple table/report, roughed out navigation, etc.
With the rough (very rough) mockup, find some stuff you like online, likely a toolkit or framework, and make some static pages. Do not spend a lot of time on this part. The goal here is to move forward and make progress. It’s easy to get trapped and distracted, but, especially on the web, making the screens look different can be really easy to change.
Finally, start bringing the pages to life. Again, pick a tech and just dig in. Once you’ve brought the pages to life, you’ll be much more critical about what worked and what didn’t if you decide to look at another front end toolset. Even if you do later change your kit, you can probably keep your mock-ups.
But if you follow through, in the end, you have high level, functioning examples of a good chunk of your big block UI parts, using your code, that you understand, against your backend. You know a bunch of things that work, and, as well, a bunch of things that don’t.
Having the mock-ups gives you built in, methodical list of things to check off. Gotta make each field work. This helps keep you focused.
This will take a spectacular amount of time. GUIs are choked with detail. But work through this and “you’ve seen it all”. Everything else is a variation of what you’ve already done. You’ve built up a lot of momentum that can give you more rapid progress.
But those first screens, they’re the nut. They’ll be a lot of work.
Done and done.
More generally, try to think of your sever as sending a static HTML document for each web request and much of the UI complexity automatically shifts to the backend.
my bootstrap: https://github.com/nathants/aws-gocljs
the project: https://reagent-project.github.io/
Depending on what exactly you're trying to launch, it may only take a few hours/days of work. If it's interesting in its own right, does some community good, or even just has a good risk/reward ratio (i.e. the frontend person puts in a few hours of work upfront for the potential of X% later on), you might get a few bites.
--------------------------------------------------------
As a former full-stack dev now focused on the frontend, I'm in a similar (but reversed) situation... I don't enjoy working on backend stuff, but frontend side projects are very quick to whip up for me (can get a page up and running in a couple minutes, a workable prototype in an hour or two, typically).
That's largely thanks to recent startups like Vercel, Netlify, Gatsby, Remix, Astro, etc. that have taken it upon themselves to improve the frontend (at least JS/React) developer experience. The vendor support adds a LOT of quality-of-life such that it's no longer as difficult as it was 3-5 years ago to spin up new MVPs.
As an example, my stack is often:
- Vercel for hosting, because they take a Git repo and host it for you in a couple clicks and manage everything. Free or cheap ($20/mo) at MVP stage.
- Next.js (Vercel's open-source React framework) will handle frontend tooling, routing, type checking, and linting for you with a single command (`npx create-next-app`). Starting the server is one more command (`next dev`) and your page is up and running.
- For the UI layer, I'd recommend either starting with one of their prebuilt templates (https://vercel.com/templates/next.js) and modifying it as needed
OR using a modern component system like https://mui.com/ or https://ant.design/ or https://chakra-ui.com/ instead of trying to learn and write your own component and JS+CSS code. Using one of these systems will allow you to compose complex apps out of well-made, well-documented, easy-to-use primitives, making it much easier to focus on business needs rather than basic frontend components and infra.
The basic MUI system, for example, is totally free. You can find third-party apps built on top of it (https://mui.com/store/#populars) and pay a one-time license fee to essentially "fork" them, getting a prebuilt working app that you just attach your backend API calls to.
There are also low-code extensions of these frameworks (meaning you start with a GUI, plan out your app that way, but still have access to the source for future advanced changes). One example is https://mui.com/toolpad/
----------------------
Is this a lot? Yes and no. React has a learning curve of its own, but it can take the place of having to learn raw HTML and CSS. (Yes, you eventually should know those things for debugging and polishing, but they are largely a level of abstraction below what you really need for a basic MVP).
Once you learn React, its primary value isn't that it's a great language (opinions differ) but that it has a humongous ecosystem of third-party vendors, free open-source libraries (basically any component you might think to build is probably already available on npm), and a wide availability of devs from hobbyists to full-timers.
Others in this topic will suggest going away from Javascript as much as possible (and using things like HTMX or backend-to-HTML solutions like the old days). That's fine, but you lose out on the rich ecosystem of React and Javascript, so you end up having to build more yourself -- which is what you're trying to avoid in your case.
My own 2¢: As someone who grew up with HTML and made websites since the birth of Javascript and CSS, the web has always been messy. It's always been a semi-open ecosystem controlled by a few major companies (whether that's Netscape or Microsoft or Sun or Adobe, or these days Google and Apple), so it very much suffers from design-by-bullying. Whoever is the power player of the decade gets to add their favorite technologies that everyone else is forced to adopt. Thus the web became a hodgepodge of document markup systems poorly fitted for modern apps, with various hacks on top of hacks built to satisfy some big company or another's in-house needs. Sadly, that means going "vanilla HTML+JS" doesn't leave you with much, just the shattered legacy of poor historical decisions.
React at least helps by encouraging componentization and abstraction of UI elements to functions, using cleaner data models (actual variables and objects) vs direct DOM manipulation (using page content as a store of state).
We've gone through many generational shifts in approach, from the raw HTML days of Geocities to the you-build-it, we-host-it approach of Godaddy and its ilk, to the "all in one" CMSes like Wordpress or Drupal. These days, (if you want there to be), there can be a pretty clear separation between backend and frontend systems, and with that specialization came a bunch of startups (mentioned above) whose approach is "let us help you build it as best as we can, so you can focus on business logic instead of basic UI and infra". After 20 years of doing this, the current state of the web developer experience is actually my favorite so far. HTML and CSS suck for building apps (as opposed to documents), and although Javascript is a lot better since ECMAscript v6 (ES6), it is still inextricably tied to the DOM (and thus HTML elements) unless you use an abstraction like React.
It's the difference between writing something like:
```
import {Datatable} from 'third-party-ui-kit'
```
(Where it'll look good enough out of the box, plus give you filtering and sorting etc. for free, all with good documentation and support) vs writing your own table generator, HTML and CSS for every cell/row/column. Could you do that? Sure. All the modern hosts will still support that sort of document. It's just a pain to write and maintain.
- Streamlit for very simple frontend, you can code in Python.
- TailwindCSS + Vue. Very easy to pickup and you can learn only a small part of it to get your website working. (There are many templates of components to get you going quickly).
I'm actually the opposite, I know some frontend but struggle to get backend working for my side projects.