Rails is not the only choice that does so. And people with broader skill sets can assemble their own solutions and might not want that anyway. But this author just wanted to pick a platform and move on, and yep, Rails works for that.
Rails is not the only choice that does so. And people with broader skill sets can assemble their own solutions and might not want that anyway. But this author just wanted to pick a platform and move on, and yep, Rails works for that.
* Javascript has such a minimal standard library, you will need to get one or three third-party libraries to augment its core.
* React is an excellent view library and nothing more. You will need to get one or three third-party system to turn it into a fully fledged web framework.
* Frameworks like Next.js are good enough to create a static page, but as requirements grow more complex, its limited feature-set and lack of in-depth documentation will feel like a prison.
* Dev tooling is non existent, so it's on you to get and _configure_ a linter, type checker, testing framework, bundler, etc.
Without speaking of the DOM and CSS, which are just _now_ starting to feel feature complete for most use cases.
Javascript proponents say the ability to mix and match is its strongest feature, but to me the analysis paralysis of having to stop and shop for a library that does X (and will only do X) is a total productivity killer.
Maybe 5-10 years ago, there is no need anymore
> React is an excellent view library and nothing more. You will need to get one or three third-party system to turn it into a fully fledged web framework.
Depends on your needs. Small app? React on its own is enough. Larger app? Add a router. That’s basically it. If you want a centralized state store, you can pick one of those up. It’s really not that difficult.
> Frameworks like Next.js are good enough to create a static page, but as requirements grow more complex, its limited feature-set and lack of in-depth documentation will feel like a prison
I don’t find any of this to be true.
> Dev tooling is non existent, so it's on you to get and _configure_ a linter, type checker, testing framework, bundler, etc
You mean there is nothing built in to the language itself? Yeah, that’s a feature in this case. We wouldn’t have the amazing 3rd party tooling if it did. The JS tooling ecosystem is amazing and getting things setup nowadays just takes one command.
> The JS tooling ecosystem is amazing and getting things setup nowadays just takes one command.
Which command would that be? Sure it's one command if you use one of a billion template projects, but just picking one of those is a chore and I'd never call that situation "amazing".
Like, create-react-app is great, but if you have to eject, you've got no parachute
Anyways, if you know enough about FE to have an opinion on the tooling, great, choose what you want. If you don’t wanna choose, use Next.js or CRA with React/Styled-Components and then add React Router if you need routing and add state management if you need it.
These aren’t difficult choices to make. I have a feeling that the problem is that people are trying to make decisions they don’t need to be making up front.
Evaluate the choices when you reach a situation that requires it.
Would you please send a link that summarizes this "everything else"? Every time I take a look at JS ecosystem I get lost.
That’s the standard setup nowadays and it’s what most people should go with. If you want type checking, add TS to the mix.
But seriously, just use Next.js you can build tiny static sites with it and you can build complex SPAs. It’s very lightweight and basically just strings together all these tools while adding some convention that you can follow if you wish.
First, these generators are incredibly flexible. You can easily construct one command that fits your requirements. Understanding the correct options, your requirements for every part of the tool chain, and their occasionally predictable down-the-road implications takes quite some time, admittedly. However, all professional tools require knowledge and doc reading and experience with the latest bleeding-edge tools and experimentation and luck, I assume. Once you get a few years of experience under your belt working with this tool chain (not skipping the 3-4 hours per day after work to keep up with the latest JS ecosystem updates for this and the other new stacks you’ll need to learn throughout the week) you’ll be able to craft a command that requires very little reading or luck to use, and it could work, unmodified, for days, if not a week. If it turns out to not actually do what you want, you probably want the wrong thing— just ask on SO. But one-and-done, friend. Set it and forget it.
Second, this is all really easy if you just take the time to understand the tool chain. It’s just 4 or 19ish crucial, interdependent parts that all really should be in place from the very beginning and only most of them have inscrutable configuration schemas. Some are even documented! If you need more handholding than that, Sally, countless domain experts in countless online fora eagerly offer guidance like “go learn how X works first” or “lol that guide is weeks out of date— you have to use knippull.js instead of GROUNCE because GROUNCE was taken over by FlammBae last week and they’re just trying to sell add-ons for their data store and have ignored all PRs to support the latest version of SLAPPD which flibBleJs uses to transmogrify bNumbn{e}rs templates which you need for tr1xBits.js to work.” Once you understand how that all works, and understand how the generators implement those things, know how to compensate for the NBCF delta (Non-Backwards-Compatible Feature delta which calculates the number of implementation changes between typing the first character of your command and hitting enter,) theoretically your one-and-done is undeniably achievable.
Finally, people overstate the complexity of fixing a project started with the wrong boilerplate. Just experiment a bit. Spend a few days trying all the options to see which welcome pages don’t look broken in your browser (unless, of course, you’re using Waggle with FlermBox) and then narrow it down a bit based on that, and then just pick one. You can always fix it if it’s wrong. A literal child could understand the concept of “delete your project and start fresh” so I don’t think it should be hard to explain the concept to experienced software developers.
Developers used to paralyzingly straightforward legacy logic and organizational paradigms love to say that JS web dev tooling has the logical structure of a Wallace and Gromit short. They're completely ignoring the fact that this process was not designed— it evolved, and that’s okay. Not great, but okay.
Ultimately, it might look a little weird and insane and fragile if you peel back the onion skin to see how the sausage gets its secret sauce— but you too can achieve the pinnacle of modern developer push-button convenience with JS.
Is still either create your own or install a random package that brings other 20 as dependencies.
Example, you want to show an Alert or Yes/No popup, This are built-in everywhere but n Web world you need to review and install a third party thing, or create your own buggy or incomplete implementation.
Maybe you want modal dialogs, this is a standard in GUI tookits but you need to create your own or install a package/module/plugin specific for your project shitty framework
Maybe your designer demands a (context) menu one with keyboard shortucts and native looking like , or a scrollbar that matches the website/app theme colors or that works horizontally without holding Shift like in native apps, you have again to find 1 solution from a giant pile of shitty packages.
The dropdows,scrollbars, number spinner, color picker inputs CSS customization is pathetic, the designers demand customization and the only solution is installing third party stuff.
There is no DataGrid or ListView component with a smart implementation that can hold many items so all websites implement a crappy inefficient thing, or show you only 20 items and you need to hit NExt Page like a money or again you find a third party solution.
As a language JS progressed a lot, so much I am not sure if switching to TS is a good idea or I just need to wait until JS will catch up with TS. But as a platform the Web /DOM is still garbage, CSS got some nice feature with flexbox but that is all.
People that did not wrote complex desktop apps with a GUI framework will not understand this, and think that the shitty component they create by nesting 12 divs and catching 2 events is the exact same thing. It is not, this GUI frameworks components are efficient and handle all events/cases properly. Even Google devs were incapable to make the Youtube search suggestion dropdown work correctly, many times it gets stuck open and you can't close it without a reload.
Can you elaborate on this? TS is just adding type checking to JS, the only runtime addition are enums. I doubt that JS will incorporate type checking anytime soon.
I mostly agree with your other points.
But I think you're hitting on two different, yet very related, issues here.
1. Browsers have a very limited set of standard UI components
2. Browsers are held back by the decades long, uninterrupted chain of backwards-compatibility
Both of these things are true. Back in the day, browsers forced more convention and design on elements (alert, select, input, list, textarea, etc), though developers weren't happy with the pace of innovation and design choices offered by the browsers so they began looking at alternative ways to implement the same thing. Eventually the browsers loosened up the restrictions and allowed styling of most of these elements in almost any way you like (though there still are issues).
The great thing about the web is that you are allowed to do this. You have the freedom to build things anyway you like. Of course, that comes with drawbacks like you've pointed out above. iOS is great because it provides a standard framework and approach to implement all of the things you outlined above. Though at the same time, you are limited to UX decisions that Apple deems "correct." I own an iPhone and Macbook and I wouldn't want it any other way at the OS-level.
But the web is the one platform we have where you don't have to abide by anyone's rules. The whole industry can iterate on approaches and the best ideas win. I like this world. I know it's not for everyone, but we don't have any other platform with such reach and freedom from any one company making the rules.
The truth is that for desktop(no idea about iOS or Android) I can also customize things as much as I want and I can do it faster and get better results. Desktop GUIs can give you pixel level access so you can have a button that plays a video inside it and rotates around while jump[ing and changing opacity.
About the Web I don't want to remove the option for everyone to invent their own menus if they want, I wish Mozilla,Google and Apple provide native options or as a stand alone library that you optionally include in your project.
For SPA this browser makers could colaborate to provide a standard framework, optional to use but would have all the basic features, bugs fixed and security updates, but it would be done by professional developers not as a side project by some Google dev with 0 experience in GUI toolkits.
I'm very bullish on SvelteKit — hits all the points you mention above and outputs a minimal, performant full-stack app. https://kit.svelte.dev/ Still in beta and changing a lot but really really lovely to use.
Heck, to scratch my own itch I'm even making a Rails-like SaaS boilerplate to go on top of SvelteKit to give me all models, user auth, admin dashboards, payments, etc that you need in almost every app these days: https://sveltesaas.com
Oh, and also they provide a repl to your app code and data… that is huge and super hard to find in the js world
A key strength for Rails is Ruby and a key weakness for any aspiring JS equivalent is JS and the JS ecosystem.
If the Rails team had had to spend time adapting to 6 different alternatives to bundler, rack, and every other library they use it wouldn't be what it is today.
I already have my own back end, but sveltekit is all about using their back end stuff. And their back end is 100% all in on serverless functions. If you want to write a more traditional back end and do something like grab private API keys when your service starts up, well sorry no easy way to do that, although there is an active git issue thread with people pretty much begging for the functionality.
Doing stuff like initializing logging libraries and passing them to models, or fetching API keys from secure storage buckets, is such a very common operation in any at-scale app, that I am beyond obscenely surprised sveletekit doesn't offer an out of the box way to do those things.
I eventually beat it into shape of generating a true SPA, generating paths that weren't at the root of the domain, and I convinced express to serve up assets accordingly. Took way too many days to get it working though.
How so? I found NextJS to be one of the most pleasant and well documented frameworks to work with. Sure, you'll have to read most of the docs to find out how to do something the NextJS way, but so far, I've come to agree with every design choice they've made.
The only gripes I have with it are debugging serverless functions that work in development, but then break in the vercel/aws blackbox.
Also the APIs are very simplistic, I haven't used it in the past few months when I quit my job, but I vividly recall how anything outside of the simple examples it provides were an exercise in frustration and digging into Github Issues and its source code. The whole data fetching system is so incredibly convoluted if you're doing a little more than static pages or build-time rendering. getInitialProps, getServerSideProps, getStaticProps, hooks, etc., all with their own caveats and performance considerations.
Next might be one of the better JS frameworks but it's laughably bad compared to Django, Rails, Phoenix.
I think on the backend we historically have had more complex problems sooner. You gotta connect to some database, serve multiple pages, track some context along, render views or API responses. It's much easier to anticipate the need for a framework or solutions to these problems sooner.
For anyone curious linkedin.com is a massive ember.js app and they're big contributors to the project.
While I liked the React approach to UI modularization much more than that convulted MVC interpretation Ember had, Ember's routing was quite awesome, and I missed it switching to React.
No that’s only true for “junior-based development” where every greenfield project is given to juniors with an assumption that “they will learn on the job”. So they start with a simple framework and learn “while the requirement are getting more complex”.
What in fact happens is that the project was severely under-specified by the stakeholders and the juniors had “no idea that would be needed”.
* should I use npm or yarn? Why do I see most package authors recommending yarn when npm is the default as far as I know?
* should I introduce Typescript to be able to handle complexity better?
* which module system? I see lots of "require" VS "import", if it needs to work on browser/node.js/deno, which one?!?!
* which test framework? Mocha? Karma? Jest? Cypress?
* should I use a bundler like webpack or just move on to esbuild? Vite? Deno?!?!
It's a nightmare every time I am forced to use JS (usually because of cloud services normally offering JS lambdas and nothing else)...
Most of the dependencies you will install will have no tests at all anyways. This is another issue of its own, you are building on very weak foundations.
It's too fine grained.
Then, at some point, I want to run some unit tests using Jest or something, and it turns into a total fucking nightmare. Each bit of tooling has certain expectations for how it expects you to import--relative vs non-relative? Do you include the .js at the end? What about .ts at the end? (That one is always "no".) Do you need .js / .mjs or .cjs / .js? Do you use ts-node? Do you want to see a warning printed to stderr every time you run Node?
1. Doesn't matter so much as long as you're using newest versions of either one. Newest yarn has plugin support which is neat. Npm has more stable backing and an open roadmap. Could be some considerations regarding monorepo support, but otherwise either is fine.
2. Yes
3. Use ES6 modules
4. Jest + Cypress
5. Vite
Yarn and NPM has been around for a long time. Yarn 1 used to be the better choice since NPM stagnated, now they're a bit more equal.
Typescript has been around for a long time. So has ES6 modules. Same for Jest and Mocha.
The only thing that is changing somewhat are the bundlers and build tools (thankfully, they've been the weakest part of FE dev for a long time).
I've kept up with frontend for many years. There really isn't all that much "fatigue" if one actually understands what the tools do and the niches they fill.
* Should I use npm or yarn?
This is one area where JavaScript is notoriously weak. As another comment mentioned, the answer might be different a couple of years from now. I discovered a package manager recently named `pnpm` and it is incredible, quite frankly. That being said, any package manager will do. They all work well (relatively, npm gets very slow in bigger projects).
* Should I introduce Typescript to be able to handle complexity better?
In 2022, the answer to this is almost always yes, for backend systems. I think this is unfortunate because you do need a transpiler. But its ease of use and type safety are hard to pass up once you've used it on a project. For frontend I tend to be more lax, although a lot of developers argue you should use TypeScript there too.
* Which module system? I see lots of "require" VS "import", if it needs to work on browser/node.js/deno, which one?!?!
Nowadays you'll likely only use `import/export`, especially if you're using TypeScript. This is not a question most JavaScript devs ask on a daily basis.
* Which test framework? Mocha? Karma? Jest? Cypress?
The short answer is it doesn't matter. The longer answer is that if you want assertions and snapshot testing built-in, Jest is a good choice. If you decide to go with Mocha, you'll need an assertion library (most commonly Chai). You probably don't want to use Karma as it was originally designed around Angular 1.x and it's starting to show its age.
Cypress is an end-to-end testing framework and has nothing to do with the rest. You'd use it in place of something like Protractor or Selenium. Additionally if you're using something like GraphQL you probably won't be able to use Cypress without a lot of hardship.
* Should I use a bundler like webpack or just move on to esbuild? Vite? Deno?!?!
This is only relevant in the frontend nowadays. And you'll probably want to use Vite. `esbuild`, while an amazing project, is a bit too verbose to set up and Vite uses it under the hood. IMO Grunt and Gulp and Webpack have never been good bundling systems (I dread every time I have to use these), so any new innovation in this area is welcome.
I see a lot of people complaining about the constant churn. I'm of the opinion that the JavaScript ecosystem is constantly improving. Vite and pnpm are absolutely amazing and I wish I would have had these tools when I was first doing frontend development. I would argue that every year JavaScript development gets way easier, not harder, and now it's the most accessible it's ever been.
Unfortunately, the amount of options can get overwhelming. Off the top of my head, there's a ton of HTTP frameworks (Express, Koa, Sails.js, Hapi.js, Nest.js, etc.) The list goes on. However I don't think this is a fair argument against JavaScript. There's a lot of choice in the Python and Golang world too. Just make good choices (maturity, stability, support) and don't always choose the newer, shinier framework, and you'll seldom run into problems in the JavaScript ecosystem IMO.
I looked at pnpm and I like it... so it's bringing the Maven strategy of having ONE place where dependencies are downloaded to and shared between projects to JavaScript!?.. which has been used since early 2000's in Java land... :D good.
I don't care to implement a forgot password form or api token generation for the Nth time. Give me an 80% solution and then on with the show.
I couldn't even imagine starting with all of these disparate pieces of JS tooling - 10 steps back. Strong defaults and integration give so much.
I genuinely think templates like JumpStartPro are the future of Rails.
Very high level template functionality already baked in so that you can immediately get to solving the core business issues.
Do people believe this about Angular? Not primarily a front end dev, but in my limited experience with React and Angular, it seems like Angular's strength is that it provides more structure for scaling to larger projects.
It's easy to learn, the code is super clean, TypeScript is great, and imo it generally just makes for a good work environment.
You say this like it's not an 8 year old framework. I wouldn't have such high hopes for it rising significantly.
- The number of round trips needed to render a page needs to go from 3 to 2.
- The amount of JavaScript in the core framework needs to be slimmed down.
The second is already on the roadmap -- they are making Zone.js optional, and supposedly the next version of RxJS is going to be significantly smaller. In order for this to actually happen, Google needs to keep funding the project for at least another full year, which seems likely given how much they depend on it. In terms of the former -- well, it seems increasingly likely that they'll work on adding those kinds of options to the CLI once they get through with the other stuff. And if not, you can alway go back to straight Webpack and just do it yourself. (I personally like the benefits of the CLI and not having to deal with Webpack, but if Webpack keeps improving then who knows, maybe I'll switch back.)
Rails doesn't save you from any of this, none of the back end frameworks do. I prefer writing SPAs because if I prefer to be directly authoring my HTML+JS instead of authoring it indirectly through a framework in a different language.
My hope is that this has been/will continue to change over time, is this a fare statement? Does anyone know if the various working groups (e.g., WHATWG, W3C, etc.) have the goal of making the JavaScript more robust?
My vision is that the standard, built-in APIs would serve as a minimum viable platform that you can build simple to moderately complex applications in with only "minimal" external dependencies.
Because ... variety of reasons, see tis comment thread: https://twitter.com/bakkoting/status/1488363368268251138
This may speed up a bit if the Built-In Modules proposal [2] passes, which would add a deliberate `import` URL for standard modules which would give a cleaner expansion point for new standard libraries over adding more global variables or further expanding the base prototypes (Object.prototype, Array.prototype, etc) in ways that increasingly likely have backwards compatibility issues.
TC-39 works all of their proposals in the open on Github [3] and it can be a fascinating process to watch if you are interested in the language's future direction.
[0] https://tc39.es/
[1] https://developers.google.com/web/updates/2018/03/smooshgate
If you can settle on a good enough batteries-included framework without analysis paralysis, you can make the individual as-needed decisions about libraries without it. It's not a problem of a higher order.
If anything, it's lower-pressure, because the cost of a wrong choice is much smaller.
I’ve yet to see anything in Node that feels like a stable 1:1 replacement. Next.js is excellent, but you still need to sort out a lot of pieces on your own.
Recently I’ve also been impressed with Remix that was mentioned in the article. It seems to have solved the client server code duplication problem while still offering the benefits of both.
But to be fair 99% of JS backends I see are using Express (or AWS Lambda). Considering there's lots of choices I wonder if the problem is the fact the community never focused on a single solution. I wonder if a Merb/Rails-style merge between some of them would help that.
The point is that Django lacks a sane default for project structure and it costs time/money to people using it.
There is a very good talk from Dan Palmer from Djangocon 2021 called "Scaling Django to 500 apps" that gives helpful advice for project layout in a django app that may only have a few or several apps:
https://2021.djangocon.us/talks/scaling-django-to-500-apps/
That said, if we're going to dig on Django, it lacks typing, core-based API patterns and any embrace of modern front end. There are positive signals though, releases are coming faster and there is some real talent on the tech board right now.
I do think django and python in general are in a defensive position to hold the future of backend webdev compared to node / deno. However, there's still plenty of opportunity to compete for developers.
I’m not sure why there should be; for people who are happy with “good enough” default choices for a web app, Rails exists and makes the choice “Ruby” when it comes to language.
npx create-next-app@latest
# or
yarn create next-app
I would choose npx while my friend would choose yarn but there isn't a default or even an indication of why you might like either choice. We kinda just assume everyone already has a preference for npx or yarn.This is really a Node or JavaScript problem and not an Next.js problem. Not that I have any idea how you might solve it. This is also just a single example and we tend to have these decisions at a lot of steps along the way.
I'd say it is still a mix of both and both paths are well-supported and well-maintained.
No doubt here! I know there's a lot of nitpicking, but that's just my experience so far. I wanted to make it clear by removing all "we" or "you" words from the post to make sure I'm not saying my opinion is the definitively right one :)
> Rails is not the only choice that does so.
Absolutely, the only two reasons I went with Rails is because Ruby looks beautiful to me and I was following the news in Rails world for years.
On personal projects I do whatever the hell I want, in professional projects I always use a framework, to make sure everyone is on the same page and we don't have to bikeshed every simple decision on the road to delivery.
I know it sucks, because Rails is better than Django, but at the end of the day I love Ruby but my day job is Python. Also, even though I can never remember capitalization, underscores , pluralization, interfaces in Python[0] at least I don't have to think when I type `and` and at least strings aren't mutable by default and when I need the data science it's right there waiting for me.
[0] lol "".startwith, "".starts_with, start_with(""), etc. In Ruby it's Time.now, come on people.
> In Ruby it's Time.now, come on people.
YMMV, but I don't find it terribly burdensome to import datetime and call datetime.now().
Because is it datetime.datetime.now? or date_time.date_time.now? or datetime.Datetime.now? Or datetime.DateTime.now? Or DateTime.now? or dt.datetime.now?
Because it could be any of those. Some people import datetime like numpy (import numpy as np) so they can call timedelta like dt.timedelta and this is fine and everything, but the combination of no standard in python for how to do this, plus the hard to remember interfaces, plus the multiple libraries that try to do the same thing and the different way they differ in capitalization, etc. Means there is just way too much to remember off the top of your head.
In ruby it's Time.now and I never forget it and I never have to import it and that is honestly awesome. If I open a shell anywhere in any project for any version of Ruby I've used the current time is just eight chars away, and even though I love Python, that has never been the case on any Python project I've worked on and I've worked on more than a few.
If I were to write a web app, my first instinct would be to go back to Rails. However, I do agree with you that much as I like Ruby and Rails, Python would be my overwhelming choice for analytical or numerical code - and I do like Python.
One possibility would be to handle as much CRUD and UI development in rails as possible, and make analytical code available to the app through services in Python.