6 ms·

I will go even further with this one. I've been working on a personal project of mine with REST APIs on the backend and a fancy combo of TypeScript/React/Redux

I will go even further with this one. I've been working on a personal project of mine with REST APIs on the backend and a fancy combo of TypeScript/React/Redux Saga on the frontend. Everything was shiny and cool, except the overall development process was super slow. I'd spend hours polishing components, figuring out various states, installing TS libraries, fighting the compiler and god know what else. It was exhausting and tiresome, until one day I said "f#%k it, I'm done". I opened my favorite search engine and typed bootstrap premium themes. jQuery? Whatever. HTML? Fine. Pure CSS? Sure! No AJAX. No fancy reloads. No history management. Plain old <form method="POST">, good ol' cookies and simple HTML files. Within just three weekends I was already MILES ahead of a previous stack. Long story short, if you are working on a personal project, please, consider the most dumb setup. With the vast options of super polished modern frameworks, it'll take you pretty far. A few more weekends and I'll prob be ready to go prod. Edit: remembered something fun. I have a page that requires to poll the backend and then take some action. So I thought a bit of Ajax is fine. I opened the corresponding HTML file and started typing: <script> jQuery.ajax(...) but then... hold on a minute! That's getting way too complex. META REFRESH FTW, M%F%CK%RS! :D <meta http-equiv="refresh" content="5">

pjerem 5y ago
> Long story short, if you are working on a personal project, please, consider the most dumb setup. This is not limited to personal projects. I can’t recall more than a single project I’ve worked on during the last decade where front-end code was really useful. Some cool stuff, ok, but never worth the pain. I acknowledge it can be useful. For some real time project. Not for your crud-for-a-living.
- ransom1538 5y ago
  Nailed. It. Yes. I work with GCP (google console) for work ALL DAY. It is a layered gross mess of SPA. Example, I need to list the servers. It will take 10-20 seconds to load the list of 30 servers. I don't care about the cool glitching transitions or boxes with fades. I want to list the servers. Hit the back button? OH WELL! All your session data is now lost. Anytime I type in GCP the computer hangs while it processes thousands of lines of javascript to see if I will autocomplete. When I click "create" my browser tab hangs while my macbook pro fan cranks up. I want to rewrite the GCP console with HTML, using their api and not one damn line of JS.
  - password4321 5y ago
    I think this is their way of encouraging people to use the CLI.
    - zbentley 5y ago
      I have the same challenges with the AWS ui, managing thousands of EC2 instances. While the CLI makes it a little simpler, it's still slow as molasses. Some of these problems are because of frontend cruft (perhaps with the goal of nudging users towards APIs) to be sure. But plenty of them are due to the reality that the cloud providers' backends often do not, ironically, work very well at scale.
  - rawoke083600 5y ago
    100% ! I know it's not comparing apples to apples.. but do have a look at Hetzner Cloud UX. It's FANTASTIC ! Super minimal, functional and I can almost bet they didn't use a"UX Designer" I got the feeling they gave the programmer-already-on-staff that could name the most colours the UX-Design-Job. IT's such a joy to spin up servers and work in that UX compared to GCP and AWS !! Scaleway had a good one a few year back, but now every page feels like a "marketing flyer" that screams BUY-ME all the time :/
- woah 5y ago
  It’s easy to use the simplest possible stack on a personal project. You set the requirements and you will probably end up setting requirements that work with that stack. On a professional level, the requirements may mostly be for a basic CRUD app but it will have a few requirements for interactive or real-time features that are not possible with a static html crud app. The client is not going to want to hear your hacker news spiel about how JavaScript has ruined the internet. Now you’ve got to embed mini SPAs into your static html, and you’ve increased the complexity past what it would have been had you just used a SPA in the first place.
  - MattGaiser 5y ago
    And just scope creep in general. I can't imagine doing professional work without an SPA because that exposes me to risk.
hatch_q 5y ago
You don't need redux most of the time, let alone sagas. It's very common mistake. Mostly you can use `useState()` and just pass it with props. If you really need reactive global state i'd prefer to use MobX.
- akvadrako 5y ago
  You don't need MobX either – for global state you can just use useContext().
  - datavirtue 5y ago
    Classic React. The subject of state comes up and a debate starts as the noobs squint at the screen. Pretty much the whole point of this thread/post. I started a significant project using React and tried for days to figure out how to handle state. After endless debate and conflicting advice online I felt I needed to speak with someone who has built a real world business app to explan how the fuck they pulled it off without pulling out their hair. (Still very curious but spooked enough to avoid sauntering onto a React project to find out.)
    - qudat 5y ago
      Thats because in the react world its all about state management. Once it clicks that the view is just a function of state then these discussions will make more sense.
      - blacktriangle 5y ago
        This is one of the statements I hear over and over from React devs that while technically true just glosses over the giant iceberg that is state management in React.
    - atom_arranger 5y ago
      Use a networking library like relay, or react-query and 90% of your state management problems go away in most apps. Your state is on the DB, those libs handle fetching and caching it. Honorable mention, haven’t used it myself but there is RTK Query too, which is a library like those, but based on Redux, could be easier to debug.
tdeck 5y ago
Also, consider using Rails and Turbolinks if you're familiar with them. You can get pretty far with turbolinks and the responsiveness is similar to a single page app.
- andreygrehov 5y ago
  Thanks for the advice. I use Go on the backend, but couldn't resist some "fanciness". I embed all the html/css/js/images files into a binary and serve everything from memory. Zero disc reads. It's blazing fast. Also, deploying the entire website becomes painless – scp the binary and restart the process.
  - selcuka 5y ago
    You can still benefit from something like https://github.com/instantpage/instant.page https://github.com/instantpage/instant.page as a poor man's replacement of Turbo(links).
  - zeepzeep 5y ago
    > I embed all the html/css/js/images files into a binary and serve everything from memory. Zero disc reads. It's blazing fast. I do that too. A friend "stole" that idea from the tour of go, I really like it. Just go generate before building to make add static files, go build, done. 1 binary, it just works.
  - psd1 5y ago
    Surely modern OSes cache files as memory-mapped files...? Given the availability of physical memory?
midrus 5y ago
Same here, except I didn't go back to that extreme. There is a wonderful underrated middleground which is using tools such as Django + Unpoly[1] + Slippers[2] + Tailwind, or Rails + view_components + hotwire + Tailwind, etc.... you can be insanely productive while still making your code very maintainable. People usually think that it is either a modern SPA or jQuery spaghetti. Those are two extremes. If you put 10% the effort you were putting into building your SPA + API key into organizing better a "modern traditional" stack.... it can be wonderful. [1] https://unpoly.com/ https://unpoly.com/ [2] https://mitchel.me/slippers/ https://mitchel.me/slippers/
- scottc 5y ago
  I just built my MVP in a Next.js monorepo. We built the mvp in a few weeks and actually landed some real customers with it. But I knew doing it in Rails or Django would've been faster, but I haven't got enough experience with either. Let's say I want to create my app in Rails (or django). I don't need it to be pixel perfect, but I do want some flexibility around the UI. ActiveRecod is fine. Can I just plug this into the admin and customize as I see fit? I know Django has a built-in Admin, does Rails? FWIW, I have used Django (without the admin) and tried learning Rails several years ago but it was too overwhelming for me. Rack middleware, the ruby syntax, the conventions—all of it seemed over my head. But if I can learn redux, react, etc, I feel like I can do Rails too. Do you have any recommendations on resources? I want to learn how to make something that looks really good, is convention-based, lets me plug in my custom code when needed, and lets me prototype fast as hell.
  - agustif 5y ago
    Hey, if you already are up with NextJS, you've BlitzJS which is a Rails-like framework for NextJS. Hope you enjoy it!
  - midrus 5y ago
    I can't speak much about Rails, as I've only played with it. But I've used a lot Django in the past. Regarding the Django admin (in rails you have ActiveAdmin[1]) think of it just as a glorified database explorer. It is an internal tool for developers, product managers and maybe for your support team. It is in no way thought to be used by end users. Every attempt I've seen to use it as such was a catastrophic failure. With Django, if you know plain HTML and CSS, with the tools I've mentioned in the comment you're responding to, you can build almost anything... For example, let's say you need a highly interactive client side table.... you can always just attach a Vue or a React component for it by using Unpoly compilers [2]. I'd say this stack is less useful the more your app needs to work fully offline... but if you don't have that constraint... I cannot think of anything that can't be built faster and safer. Just an example: Authentication is something very risky to do your self, and has ton of corner cases. In Django just plug django-allauth, configure a few settings and done! You have a rock solid battle tested well documented authentication system, which otherwise would take you months or years to get right (both featuer, and security wise). Check django-packages too [3]. And regarding learning resources, the official documentation is awesome. You have also popular books such as Two Scoops Of Django among others. And almost all video learning platforms have quite decent courses. [1] https://activeadmin.info/ https://activeadmin.info/ [2] https://unpoly.com/up.compiler https://unpoly.com/up.compiler [3] https://djangopackages.org/ https://djangopackages.org/
midrus 5y ago
"...TypeScript/React/Redux Saga on the frontend..." This plus RxJS + websockets + in-house validation libraries + ... was the stack of my last company. For doing F**ng CRUD forms. This was one of the main reasons why I left.
- deleted 5y ago
  [deleted]
the_fire_friar 5y ago
This is my recipe as well and I've launched a number of products [1][2] this way and have had no complaints from customers. [1] https://fiers.co/ https://fiers.co/ [2] https://getelodie.com/ https://getelodie.com/
satvikpendem 5y ago
How does one reconcile moving fast like this with having fun coding? For me, I don't really want to use PHP, jQuery, etc, I want to use TypeScript and React simply because they're more fun to use, if a little slower.
- tored 5y ago
  Picking complex problems where you need reason about the solution in a more general way regardless of implementation language. Like how do we efficiently receive, insert and query a gazillion rows of data. How can I use HTTP headers to my advantage to minimize data transfer in an a dynamic app. What is the best way to push data to multiple clients. How should I organize a user permissions system with users, roles, groups and inheritance and then connect that with resources dynamically (resources can be added and removed) but in the most efficient way (preferably with one query) or other complex problems that you can typically be faced with. The implementation is then just a detail, because the problem is already solved in your head (or whiteboard), thus the language becomes irrelevant. Just pick a language where you, the programmer, can be as efficient as possible to transform the solution to code. That is why I mostly code PHP, I don't get distracted with language nonsense, instead I focus on solutions to problems I solve my head and then type it down. Code should be minimal but yet readable and understandable thus elegant, condensed to what you trying to solve, not the other extra fluff around it. This also have the consequence that many of my solutions never gets typed down to code if there is no practical need for it at the moment, solving problems with your mind only can be as much as satisfactory as to coding. Remember we are engineers, we solve problems, programming languages are just tools we use, the problem and the solution will still remain the same regardless.
BrandoElFollito 5y ago
I took a different approach, having one hammer (Quasar, Vue.js, TS) for all nails. It may be too heavy or whatever but I easily build spa, pwa, electron from one place. I forced myself not to look for the new shiny thing unil I really get to a point where Quasar and Vue are not enough. I am an amateur dev and all users will have evergreen browsers and fast connections so plenty of concerns are moot.
mamcx 5y ago
I do similary, moving out Vue (that I like much and in some context could be great) and use tailwind + htmx. Incredible upgrade!
GrantZvolsky 5y ago
You took a similar path that I did with my personal website. Kubernetes, istio, redis, OIDC, redux, sagas, you name it. All this unnecessary complexity was, however, deliberate. It was an excuse to learn about all the interesting things people are talking about. Then one day I decided the experiment was over and rewrote it from scratch in ~24 hours using plain create-react-app and Ubuntu on a $5/mo droplet. It was a valuable learning experience.

pjerem 5y ago

> Long story short, if you are working on a personal project, please, consider the most dumb setup. This is not limited to personal projects. I can’t recall more than a single project I’ve worked on during the last decade where front-end code was really useful. Some cool stuff, ok, but never worth the pain. I acknowledge it can be useful. For some real time project. Not for your crud-for-a-living.

ransom1538 5y ago
Nailed. It. Yes. I work with GCP (google console) for work ALL DAY. It is a layered gross mess of SPA. Example, I need to list the servers. It will take 10-20 seconds to load the list of 30 servers. I don't care about the cool glitching transitions or boxes with fades. I want to list the servers. Hit the back button? OH WELL! All your session data is now lost. Anytime I type in GCP the computer hangs while it processes thousands of lines of javascript to see if I will autocomplete. When I click "create" my browser tab hangs while my macbook pro fan cranks up. I want to rewrite the GCP console with HTML, using their api and not one damn line of JS.
- password4321 5y ago
  I think this is their way of encouraging people to use the CLI.
  - zbentley 5y ago
    I have the same challenges with the AWS ui, managing thousands of EC2 instances. While the CLI makes it a little simpler, it's still slow as molasses. Some of these problems are because of frontend cruft (perhaps with the goal of nudging users towards APIs) to be sure. But plenty of them are due to the reality that the cloud providers' backends often do not, ironically, work very well at scale.
- rawoke083600 5y ago
  100% ! I know it's not comparing apples to apples.. but do have a look at Hetzner Cloud UX. It's FANTASTIC ! Super minimal, functional and I can almost bet they didn't use a"UX Designer" I got the feeling they gave the programmer-already-on-staff that could name the most colours the UX-Design-Job. IT's such a joy to spin up servers and work in that UX compared to GCP and AWS !! Scaleway had a good one a few year back, but now every page feels like a "marketing flyer" that screams BUY-ME all the time :/
woah 5y ago
It’s easy to use the simplest possible stack on a personal project. You set the requirements and you will probably end up setting requirements that work with that stack. On a professional level, the requirements may mostly be for a basic CRUD app but it will have a few requirements for interactive or real-time features that are not possible with a static html crud app. The client is not going to want to hear your hacker news spiel about how JavaScript has ruined the internet. Now you’ve got to embed mini SPAs into your static html, and you’ve increased the complexity past what it would have been had you just used a SPA in the first place.
- MattGaiser 5y ago
  And just scope creep in general. I can't imagine doing professional work without an SPA because that exposes me to risk.

hatch_q 5y ago

You don't need redux most of the time, let alone sagas. It's very common mistake. Mostly you can use `useState()` and just pass it with props. If you really need reactive global state i'd prefer to use MobX.

akvadrako 5y ago
You don't need MobX either – for global state you can just use useContext().
- datavirtue 5y ago
  Classic React. The subject of state comes up and a debate starts as the noobs squint at the screen. Pretty much the whole point of this thread/post. I started a significant project using React and tried for days to figure out how to handle state. After endless debate and conflicting advice online I felt I needed to speak with someone who has built a real world business app to explan how the fuck they pulled it off without pulling out their hair. (Still very curious but spooked enough to avoid sauntering onto a React project to find out.)
  - qudat 5y ago
    Thats because in the react world its all about state management. Once it clicks that the view is just a function of state then these discussions will make more sense.
    - blacktriangle 5y ago
      This is one of the statements I hear over and over from React devs that while technically true just glosses over the giant iceberg that is state management in React.
  - atom_arranger 5y ago
    Use a networking library like relay, or react-query and 90% of your state management problems go away in most apps. Your state is on the DB, those libs handle fetching and caching it. Honorable mention, haven’t used it myself but there is RTK Query too, which is a library like those, but based on Redux, could be easier to debug.

tdeck 5y ago

Also, consider using Rails and Turbolinks if you're familiar with them. You can get pretty far with turbolinks and the responsiveness is similar to a single page app.

andreygrehov 5y ago
Thanks for the advice. I use Go on the backend, but couldn't resist some "fanciness". I embed all the html/css/js/images files into a binary and serve everything from memory. Zero disc reads. It's blazing fast. Also, deploying the entire website becomes painless – scp the binary and restart the process.
- selcuka 5y ago
  You can still benefit from something like https://github.com/instantpage/instant.page https://github.com/instantpage/instant.page as a poor man's replacement of Turbo(links).
- zeepzeep 5y ago
  > I embed all the html/css/js/images files into a binary and serve everything from memory. Zero disc reads. It's blazing fast. I do that too. A friend "stole" that idea from the tour of go, I really like it. Just go generate before building to make add static files, go build, done. 1 binary, it just works.
- psd1 5y ago
  Surely modern OSes cache files as memory-mapped files...? Given the availability of physical memory?

midrus 5y ago

Same here, except I didn't go back to that extreme. There is a wonderful underrated middleground which is using tools such as Django + Unpoly[1] + Slippers[2] + Tailwind, or Rails + view_components + hotwire + Tailwind, etc.... you can be insanely productive while still making your code very maintainable. People usually think that it is either a modern SPA or jQuery spaghetti. Those are two extremes. If you put 10% the effort you were putting into building your SPA + API key into organizing better a "modern traditional" stack.... it can be wonderful. [1] https://unpoly.com/ https://unpoly.com/ [2] https://mitchel.me/slippers/ https://mitchel.me/slippers/

scottc 5y ago
I just built my MVP in a Next.js monorepo. We built the mvp in a few weeks and actually landed some real customers with it. But I knew doing it in Rails or Django would've been faster, but I haven't got enough experience with either. Let's say I want to create my app in Rails (or django). I don't need it to be pixel perfect, but I do want some flexibility around the UI. ActiveRecod is fine. Can I just plug this into the admin and customize as I see fit? I know Django has a built-in Admin, does Rails? FWIW, I have used Django (without the admin) and tried learning Rails several years ago but it was too overwhelming for me. Rack middleware, the ruby syntax, the conventions—all of it seemed over my head. But if I can learn redux, react, etc, I feel like I can do Rails too. Do you have any recommendations on resources? I want to learn how to make something that looks really good, is convention-based, lets me plug in my custom code when needed, and lets me prototype fast as hell.
- agustif 5y ago
  Hey, if you already are up with NextJS, you've BlitzJS which is a Rails-like framework for NextJS. Hope you enjoy it!
- midrus 5y ago
  I can't speak much about Rails, as I've only played with it. But I've used a lot Django in the past. Regarding the Django admin (in rails you have ActiveAdmin[1]) think of it just as a glorified database explorer. It is an internal tool for developers, product managers and maybe for your support team. It is in no way thought to be used by end users. Every attempt I've seen to use it as such was a catastrophic failure. With Django, if you know plain HTML and CSS, with the tools I've mentioned in the comment you're responding to, you can build almost anything... For example, let's say you need a highly interactive client side table.... you can always just attach a Vue or a React component for it by using Unpoly compilers [2]. I'd say this stack is less useful the more your app needs to work fully offline... but if you don't have that constraint... I cannot think of anything that can't be built faster and safer. Just an example: Authentication is something very risky to do your self, and has ton of corner cases. In Django just plug django-allauth, configure a few settings and done! You have a rock solid battle tested well documented authentication system, which otherwise would take you months or years to get right (both featuer, and security wise). Check django-packages too [3]. And regarding learning resources, the official documentation is awesome. You have also popular books such as Two Scoops Of Django among others. And almost all video learning platforms have quite decent courses. [1] https://activeadmin.info/ https://activeadmin.info/ [2] https://unpoly.com/up.compiler https://unpoly.com/up.compiler [3] https://djangopackages.org/ https://djangopackages.org/

midrus 5y ago

"...TypeScript/React/Redux Saga on the frontend..." This plus RxJS + websockets + in-house validation libraries + ... was the stack of my last company. For doing F**ng CRUD forms. This was one of the main reasons why I left.

deleted 5y ago
[deleted]

the_fire_friar 5y ago

This is my recipe as well and I've launched a number of products [1][2] this way and have had no complaints from customers. [1] https://fiers.co/ https://fiers.co/ [2] https://getelodie.com/ https://getelodie.com/

satvikpendem 5y ago

How does one reconcile moving fast like this with having fun coding? For me, I don't really want to use PHP, jQuery, etc, I want to use TypeScript and React simply because they're more fun to use, if a little slower.

tored 5y ago
Picking complex problems where you need reason about the solution in a more general way regardless of implementation language. Like how do we efficiently receive, insert and query a gazillion rows of data. How can I use HTTP headers to my advantage to minimize data transfer in an a dynamic app. What is the best way to push data to multiple clients. How should I organize a user permissions system with users, roles, groups and inheritance and then connect that with resources dynamically (resources can be added and removed) but in the most efficient way (preferably with one query) or other complex problems that you can typically be faced with. The implementation is then just a detail, because the problem is already solved in your head (or whiteboard), thus the language becomes irrelevant. Just pick a language where you, the programmer, can be as efficient as possible to transform the solution to code. That is why I mostly code PHP, I don't get distracted with language nonsense, instead I focus on solutions to problems I solve my head and then type it down. Code should be minimal but yet readable and understandable thus elegant, condensed to what you trying to solve, not the other extra fluff around it. This also have the consequence that many of my solutions never gets typed down to code if there is no practical need for it at the moment, solving problems with your mind only can be as much as satisfactory as to coding. Remember we are engineers, we solve problems, programming languages are just tools we use, the problem and the solution will still remain the same regardless.

BrandoElFollito 5y ago

I took a different approach, having one hammer (Quasar, Vue.js, TS) for all nails. It may be too heavy or whatever but I easily build spa, pwa, electron from one place. I forced myself not to look for the new shiny thing unil I really get to a point where Quasar and Vue are not enough. I am an amateur dev and all users will have evergreen browsers and fast connections so plenty of concerns are moot.

mamcx 5y ago

I do similary, moving out Vue (that I like much and in some context could be great) and use tailwind + htmx. Incredible upgrade!

GrantZvolsky 5y ago

You took a similar path that I did with my personal website. Kubernetes, istio, redis, OIDC, redux, sagas, you name it. All this unnecessary complexity was, however, deliberate. It was an excuse to learn about all the interesting things people are talking about. Then one day I decided the experiment was over and rewrote it from scratch in ~24 hours using plain create-react-app and Ubuntu on a $5/mo droplet. It was a valuable learning experience.