Join devRant
Do all the things like
++ or -- rants, post your own rants, comment on others' rants and build your customized dev avatar
Sign Up
Pipeless API
From the creators of devRant, Pipeless lets you power real-time personalized recommendations and activity feeds using a simple API
Learn More
Search - "webpack and all that"
-
Hi, I am a Javascript apprentice. Can you help me with my project?
- Sure! What do you need?
Oh, it’s very simple, I just want to make a static webpage that shows a clock with the real time.
- Wait, why static? Why not dynamic?
I don’t know, I guess it’ll be easier.
- Well, maybe, but that’s boring, and if that’s boring you are not going to put in time, and if you’re not going to put in time, it’s going to be harder; so it’s better to start with something harder in order to make it easier.
You know that doesn’t make sense right?
- When you learn Javascript you’ll get it.
Okay, so I want to parse this date first to make the clock be universal for all the regions.
- You’re not going to do that by yourself right? You know what they say, don’t repeat yourself!
But it’s just two lines.
- Don’t reinvent the wheel!
Literally, Javascript has a built in library for t...
- One component per file!
I’m lost.
- It happens, and you’ll get lost managing your files as well. You should use Webpack or Browserify for managing your modules.
Doesn’t Javascript include that already?
- Yes, but some people still have previous versions of ECMAScript, so it wouldn’t be compatible.
What’s ECMAScript?
- Javascript
Why is it called ECMAScript then?
- It’s called both ways. Anyways, after you install Webpack to manage your modules, you still need a module and dependency manager, such as bower, or node package manager or yarn.
What does that have to do with my page?
- So you can install AngularJS.
What’s AngularJS?
- A Javascript framework that allows you to do complex stuff easily, such as two way data binding!
Oh, that’s great, so if I modify one sentence on a part of the page, it will automatically refresh the other part of the page which is related to the first one and viceversa?
- Exactly! Except two way data binding is not recommended, since you don’t want child components to edit the parent components of your app.
Then why make two way data binding in the first place?
- It’s backed up by Google. You just don’t get it do you?
I have installed AngularJS now, but it seems I have to redefine something called a... directive?
- AngularJS is old now, you should start using Angular, aka Angular 2.
But it’s the same name... wtf! Only 3 minutes have passed since we started talking, how are they in Angular 2 already?
- You mean 3.
2.
- 3.
4?
- 5.
6?
- Exactly.
Okay, I now know Angular 6.0, and use a component based architecture using only a one way data binding, I have read and started using the Design Patterns already described to solve my problem without reinventing the wheel using libraries such as lodash and D3 for a world map visualization of my clock as well as moment to parse the dates correctly. I also used ECMAScript 6 with Babel to secure backwards compatibility.
- That’s good.
Really?
- Yes, except you didn’t concatenate your html into templates that can be under a super Javascript file which can, then, be concatenated along all your Javascript files and finally be minimized in order to reduce latency. And automate all that process using Gulp while testing every single unit of your code using Jasmine or protractor or just the Angular built in unit tester.
I did.
- But did you use TypeScript?37 -
Finally did it. Quit my job.
The full story:
Just came back from vacation to find out that pretty much all the work I put at place has been either destroyed by "temporary fixes" or wiped clean in favour of buggy older versions. The reason, and this is a direct quote "Ari left the code riddled with bugs prior to leaving".
Oh no. Oh no I did not you fucker.
Some background:
My boss wrote a piece of major software with another coder (over the course of month and a balf). This software was very fragile as its intention was to demo specific features we want to adopt for a version 2 of it.
I was then handed over this software (which was vanilajs with angular) and was told to "clean it up" introduce a typing system, introduce a build system, add webpack for better module and dependency management, learn cordova (because its essential and I had no idea of how it works). As well as fix the billion of issues with data storage in the software. Add a webgui and setup multiple databses for data exports from the app. Ensure that transmission of the data is clean and valid.
What else. This software had ZERO documentation. And I had to sit my boss for a solid 3hrs plus some occasional questions as I was developing to get a clear idea of whats going on.
Took a bit over 3 weeks. But I had the damn thing ported over. Cleaned up. And partially documented.
During this period, I was suppose to work with another 2 other coders "my team". But they were always pulled into other things by my Boss.
During this period, I kept asking for code reviews (as I was handling a very large code base on my own).
During this period, I was asking for help from my boss to make sure that the visual aspect of the software meets the requirements (there are LOTS of windows, screens, panels etc, which I just could not possibly get to checking on my own).
At the end of this period. I went on vacation (booked by my brothers for my bday <3 ).
I come back. My work is null. The Boss only looked at it on the friday night leading up to my return. And decided to go back to v1 and fix whatever he didnt like there.
So this guy calls me. Calls me on a friggin SUNDAY. I like just got off the plane. Was heading to dinner with my family.
He and another coder have basically nuked my work. And in an extremely hacky way tied some things together to sort of work. Moreever, the webguis that I setup for the database viewing. They were EDITED ON THE PRODUCTION SERVER without git tracking!!
So monday. I get bombarded with over 20 emails. Claiming that I left things in an usuable state with no documentation. As well as I get yelled at by my boss for introducing "unnecessary complicated shit".
For fuck sakes. I was the one to bring the word documentation into the vocabulary of this company. There are literally ZERO documentated projects here. While all of mine are at least partially documented (due to lack of time).
For fuck sakes, during my time here I have been basically begging to pull the coder who made the admin views for our software and clean up some of the views so that no one will ever have to touch any database directly.
To say this story is the only reason I am done is so not true.
I dedicated over a year to this company. During this time I saw aspects of this behaviour attacking other coders as well as me. But never to this level.
I am so friggin happy that I quit. Never gonna look back.14 -
You know who sucks at developing APIs?
Facebook.
I mean, how are so high paid guys with so great ideas manage to come up with apis THAT shitty?
Let's have a look. They took MVC and invented flux. It was so complicated that there were so many overhyped articles that stated "Flux is just X", "Flux is just Y", and exactly when Redux comes to the stage, flux is forgotten. Nobody uses it anymore.
They took declarative cursors and created Relay, but again, Apollo GraphQL comes and relay just goes away. When i tried just to get started with relay, it seemed so complicated that i just closed the tab. I mean, i get the idea, it's simple yet brilliant, but the api...
Immutable.js. Shitload of fuck. Explain WHY should i mess with shit like getIn(path: Iterable<string | number>): any and class List<T> { push(value: T): this }? Clojurescript offers Om, the React wrapper that works about three times faster! How is it even possible? Clojure's immutable data structures! They're even opensourced as standalone library, Mori js, and api is great! Just use it! Why reinvent the wheel?
It seems like when i just need to develop a simple react app, i should configure webpack (huge fuckload of work by itself) to get hot reload, modern es and jsx to work, then add redux, redux-saga, redux-thunk, react-redux and immutable.js, and if i just want my simple component to communicate with state, i need to define a component, a container, fucking mapStateToProps and mapDispatchToProps, and that's all just for "hello world" to pop out. And make sure you didn't forget to type that this.handler = this.handler.bind(this) for every handler function. Or use ev closure fucked up hack that requires just a bit more webpack tweaks. We haven't even started to communicate to the server! Fuck!
I bet there is savage ass overengineer sitting there at facebook, and he of course knows everything about how good api should look, and he also has huge ass ego and he just allowed to ban everything that he doesn't like. And he just bans everything with good simple api because it "isn't flexible enough".
"React is heavier than preact because we offer isomorphic multiple rendering targets", oh, how hard want i to slap your face, you fuckface. You know what i offered your mom and she agreed?
They even created create-react-app, but state management is still up to you. And react-boierplate is just too complicated.
When i need web app, i type "lein new re-frame", then "lein dev", and boom, live reload server started. No config. Every action is just (dispatch) away, works from any component. State subscription? (subscribe). Isolated side-effects? (reg-fx). Organize files as you want. File size? Around 30k, maybe 60 if you use some clojure libs.
If you don't care about massive market support, just use hyperapp. It's way simpler.
Dear developers, PLEASE, don't forget about api. Take it serious, it's very important. You may even design api first, and only then implement the actual logic. That's even better.
And facebook, sincerelly,
Fuck you.17 -
!rant
I built a decently large project at work, and everything works perfectly. It's beautiful, it's fast, it's light, it's organized and clean, and deploying is a breeze. I'm very proud of it.
The biggest reason, though, is that it uses exclusively technology I had never touched before:
• React
• Redux
• ES6/Babel
• Webpack
• Express.js
• Material Design
• Apple lappy (I'm a linux girl)
I was completely new to all of these, including my dev machine. Every single aspect of the project was outside my skillet.
But it went from my first experimental `import React from 'react'` to production-ready in three weeks. I'm really proud 😊14 -
Me: Well, it's time to make a new app!
* opens up VS Code *
* opens folder selection dialog *
* creates a new folder called "notes app" *
* yarn inits that folder *
* installs react and react-dom *
* installs webpack, webpack-cli, babel-core, babel-loader, babel-preset-env, babel-preset-react, style-loader, css-loader, file-loader, html-webpack-plugin and clean-webpack-plugin as a dev dependency (install is pending) *
* copies a webpack config from some other project *
* creates a babelrc file *
* copies a yarn script called "build:dev" which would launch webpack *
* dev dependencies installed *
* tries to save *
* vscode doesn't save because files differ *
* tries to copy dev dependencies *
* fail *
* tries again *
* saves *
* writes bare-bones index.jsx *
* yarn build:dev *
* opens build/index.html in firefox *
* gets satisfaction *
* writes bare-bones App.jsx which is a react component but it's an entire app *
* yarn build:dev *
* opens build/index.html in firefox *
* gets satisfaction *
-- trim --
* walks out of his room to his mom's room where's sbc is located *
* grandma plays solitare on laptop *
* i ask grandma for a laptop *
* grandma gives me laptop *
* glues all components into App.jsx *
* yarn start:dev (magic of webpack-dev-server) *
* opens localhost:8080 in firefox *
* searches how to update a component prop *
* nothing found *
* registers on devrant and verifies his email *
* writes this rant *14 -
Background: I'm not drunk yet, BUT I'M WORKING ON IT.
okay.
I just finished a second sprint on my React app. The first was to build a merchant onboarding flow. The second was to do substantial cleanup as I learned more about react/redux, and to create a "supply order" flow -- basically purchasing marketing materials and services. I finished that in a week, and I'm pretty proud. api-guy wanted it done in a day. i laughed. he probably could have, but it would have been a copy of the code in a new repo with some lines changed.
ANYWAY. it's all done and It's super pretty and works amazingly well. It has both the onboarding flow and the ordering flow, with a nice pop-out sidebar for navigation, namespaced actions, etc. Everything is pretty clean. I even added a cart to the ordering (despite everyone telling me not to) because wtf, what if someone wants to order TWO items? dumbasses. So I made that. it's sexy.
Anyway, it's all done and shiny and fancy and wonderful and I'd *love* to share screenshots if only it didn't give away where I worked. :<
... but the point of the rant!
After the first sprint, I made a copy of the repo so I could rework it and add more functionality without touching the original. (Hey! That's what a branch is for, right? Why didn't I branch it up?
well, read on)
I knew we were going to have multiple separate flows for this app: onboard, ordering, merchant tools, admin tools, support, etc. So, I wrote its server portion (the webpack builder + http server) so it would serve the same app at whatever url the user hit, and set a cookie containing that host+url. This allows the app to serve different content (basically showing/hiding content) based on the URL and future login roles. If someone hits /order, it would hide everything but the order flow. If they're a merchant, it would show all the merchant views plus ordering, etc.
tl;dr This way I can use the same codebase for multiple sites, drastically simplifying development, branding, and what have you. This new app could obv also be a drop-in replacement for the original onboarding project because of the above.
HOWEVER. this apparently isn't good enough for api-guy. He's terrified that adding/updating future components will affect all the existing content somehow.
so.
now we have three repos for basically the same codebase. 1) onboard aka "surfboard", 2) ordering, 3) merchant tools, aka "ferrari" (the "future" app).
Except.
1) "surfboard" is a very old version of the code. 3) "ferrari" is also old, since 2) "ordering" has newer content in it now.
... and somehow this is better?
fuck if i can figure out how.
His reasoning is "well, you won't be touching surfboard or ordering for 6 months, so now you don't have to worry about it." Sure, except, you know, it'll be a pain in the ass in 6 months now when I have a crapton of code and branding to redo. ffs.
Oh. We also have three Heroku pipelines for these three repos. for the same codebase.
and now you know why i'm drinking.undefined idiocy fucking hell fuck this noise api guy i'm just gonna replace everything later this codebase is as dry as the friggin ocean7 -
Stack Overflow. Everyone uses it but everyone seems to hate the community. I very often read about someone getting down voted and they all say the same thing - "I have no idea why".
I have spent a lot of time moderating SO posts, which gave me a lot of reputation and medals. I find it fun to help people and it feels good to give back to the community.
I have asked a bunch of questions and I've never gotten a single down vote, which leads me to believe everyone of you that is constantly getting down voted are doing something wrong. Because the posts I see getting down voted are fucking stupid questions that either lack information or contain too much information.
Example 1:
Server java error
Why is my server not working? I am using Tomcat, port 8080 and I'm getting IOException.
Example 2:
Webpack configuration not working
My webpack is not a working, why?
[entire webpack config]
End examples.
What the fuck are you expecting asking questions like these?? No one gets paid for answering your questions, so the least you can do is write a CLEAR AND UNDERSTANDABLE question. I'm not gonna tell you how to do it because there's A LOT of information on how to do it.
People devote hours and hours to helping others on SO, and of course they get fed up with the stupid and lazy questions. That community is not about being nice, it's not about making people feel welcomed, it's about QUALITY OF CONTENT. No one is crying when they find a superb question + answer, right? That's the result of a community not accepting low quality content.
So please, the next time you get a down vote on SO - do not come here whining about it but instead take a look at what you have posted there and ask yourself if it could have held a higher quality.
Thanks!8 -
Grunt, gulp, bower, webpack, rollup, yarn, npm, requirejs, commonjs, browserify, brunch, rollup, parcel, fusebox, babel,
wrappers for bundlers, frameworks on frameworks, then for css, theres scss, sass, less, stylus, compass, and for templates, handlebars, mustache, nunjucks, underscore, ejs, pug, jade, and about five billion other word-salad tools, all with their own CLIs, each in some way building on npm, but with their own non-congruent little syntax, like no one realized they were reinventing the same problems introduced by domain specific languages, most happy to announce "configuration takes a little time, but it's worth it!"
No, it's not. Just stop people. Just stop. You're not doing anyone any favors by creating another lib, all you're doing is tooting your own horn and self promoting. Use what exists and stop creating more shit for new people to learn, to add to the giant clusterfuck that is the 2019 hotmess known as "web development."
You're not special. You're not important. You're lib or tool will be famous for 15 minutes and no one cares what you've made.
If you want to contribute to web development, do us all a favor and contribute to global sanity by kindly deleting your contribution and any plans to contribute new solutions to problems that have already been solved.18 -
So, I'm using a new MacBook Air (running Sierra), and while I'm still getting used to it (especially the different Sublime hotkeys), overall it really is quite wonderful. I particularly love the magic touchpad and ease of scrolling/swiping between desktops.
However, I ran into an issue this morning that gave me pause: apparent file caching.
My webpack setup auto-compiles my project when files change, and I noticed something was causing errors -- not really surprising since I was in the middle of fixing the project last night. However, the error it displayed wasn't something I was expecting, and referenced a line I was positive I had removed several hours before calling it a night. Whatever, I was probably mistaken, so I went to remove it.
... It wasn't there.
I double checked that I was looking at the right file. Yep, src/styles/header.scss -- that's the correct file. Figuring webpack was acting up, I killed and restarted it.
Same error.
So whatever, maybe Sublime cached it. Rather unexpected, but possible, and I am on a mac now... so maybe. So, I closed the file and reopened it. The line wasn't there. I did this twice more. It STILL wasn't there. Maybe I'm going crazy...? I checked the file with cat. The line was there. I checked with vim. The line was still there.
OKAY. I've seen a lot of people with beef with Sublime, and I often defended it. but maybe they're actually right. maybe Sublime really isn't the way to go. :( So, I killed and reopened Sublime, and I checked the file again.
The line STILL ISN'T THERE.
Maybe I'm going crazy? I double, triple, quadruple checked the path. all correct.
Alright; let's try again and make sure I do it properly. I closed everything I had open in sublime (two projects), and quit. I reopened Sublime, navigated to the correct path, and reopened the file...
The offending line STILL wasn't there.
I'm angry at this point and just mash the keyboard. I save the resulting garbage, and cat the file again. No visible changes.
KAJSFLK STUPID PIECE OF <redacted>
okay, whatever. Reboots fix everything, right? So I reboot, and keep the option to re-open everything again ticked.
The terminal comes back up, along with half(?) my browsers, but Sublime doesn't. grrrrrrr.
so I cat the damn thing.
GUESS WHAT.
THE GARBAGE IS THERE.
Sublime was doing its job. BUT EVERYTHING ELSE FAILED.
(Oh Sublime, why did I ever question you? 💚)
... but seriously, what the fuck could have caused that? Was the OS caching the file for some programs, but not others? Now I'm questioning the macbook...23 -
writing library code is hard.
there are sooo many details that go into writing good libraries:
designing intuitive and powerful apis
deciding good api option defaults, disallowing or warning for illegal operations
knowing when to throw, knowing when to warn/log
handling edge cases
having good code coverage with tests that doesn't suck shit, while ensuring thry don't take a hundred years to run
making the code easy to read, to maintain, robust
and also not vulnerable, which is probably the most overlooked quality.
"too many classes, too little classes"
the functions do too much it's hard to follow them
or the functions are so well abstracted, that every function has 1 line of code, resulting in code that is even harder to understand or debug (have fun drowning in those immense stack traces)
don't forget to be disciplined about the documentation.
most of these things are
deeply affected by the ecosystem, the tools of the language you're writing this in:
like 5 years ago I hated coding in nodejs, because I didn't know about linters, and now we have tools like eslint or babel, so it's more passable now
but now dealing with webpack/babel configs and plugins can literally obliterate your asshole.
some languages don't even have a stable line by line debugger (hard pass for me)
then there's also the several phases of the project:
you first conceive the idea, the api, and try to implement it, write some md's of usage examples.
as you do that, you iterate on the api, you notice that it could better, so you redesign it. once, twice, thrice.
so at that point you're spending days, weeks on this side project, and your boss is like "what the fuck are you doing right now?"
then, you reach fuckinnnnng 0.1.0, with a "frozen" api, put it on github with a shitton of badges like the badge whore you are.
then you drop it on forums, and slack communities and irc, and what do you get?
half of the community wants to ban you for doing self promotion
the other half thinks either
a) your library api is shitty
b) has no real need for it
c) "why reinvent the wheel bruh"
that's one scenario,
the other scenario is the project starts to get traction.
people start to star it and shit.
but now you have one peoblem you didn't have before: humans.
all sorts of shit:
people treating you like shit as if they were premium users.
people posting majestically written issues with titles like "people help, me no work, here" with bodies like "HAAAAAAAAAALP".
and if you have the blessing to work in the current js ecosystem, issues like "this doesn't work with esm, unpkg, cdnjs, babel, webpack, parcel, buble, A BROWSER".
with some occasional lunatic complaining about IE 4 having a very weird, obscure bug.
not the best prospect either.3 -
Modern web frontend is giving me a huge headache...
Gazillion frameworks, css preprocessors, transpilers, task runners, webpack, state management, templating, Rxjs, vector graphics,async,promises, es6,es7,babel,uglifying,minifying,beautifying,modules,dependecy injection....
All this for programming apps that happen to run inside browsers on a protocol which was designed to display simple text pages...
This is insanity. It cannot go on like this for long. I pray for webasm and elm to rescue me from this chaos.
I work now as a fullstack dev as my first job but my next job is definitely going to be backend/native stuff for desktop or mobile. It seems those areas are much less crazy.10 -
I've been lurking for a while but I had it up to here with these goddamned "js sucks" posts.
I'm not gonna deny js has severe design problems,
or that chromium is a motherfucking vampire
or that it's a goddamn pain in the ass to understand how to babel webpack + plugins correctly
that is all true.
the problem is that it's just a lazy damn circlejerk at this point where no learning is gained, with no outlook on any possible solution of these problems, let alone ANY type of actual collaboration to help the situation.
sometimes people don't even care to specify what is specifically wrong with js. It's just "js sucks" and that's it, farm ++.
slack is a ram hog, yes, yes, we know... WE KNOW.
every 5 days someone has to remind that!
is there any solution? why is it a ram hog? is electron the problem, or is the slack source code doing weird shit?
are there any lightweight alternatives to electron?
That's actual good conversation, but no, apparently it's impossible to drop the snarky tone for 2 seconds.
I think it's fine to point out defficiencies in applications, but it's not ok to shitpost on and on.
I would very ok with someone shitcomplaining about js is if they were doing something about it.
I'm still ok with people letting of some steam, I'm fine with people expressing frustration from direct work experience with js. I'm not ok with people and their ignorance and snarky comments and non helpfulness while comfortably laughing from their own camp of totally unrelated technologies.
Hearing sysadmins or people that code exclusively in c shit on js makes me feel my insides twirl.
Imagine I didn't do shit for linux, but I went around forums pointing out the defficiencies, like the lack of standards, and saying that mac is way better.
Or I if yapped on and on about openvpn and having an obscure as fuck api, meanwhile not doing a single fucking thing about it, or not even using it in a day to day basis.
do you hate slack's ram usage? me too and js isn't going anywhere in the next 5 years, so either do something or provide smart conversation, diagnosis of the problem or possible alternstives/solutions, otherwise stfu12 -
There are three things in my workflow that I don't like:
1. Feature requests appearing out of thin air.
It's common to be handled work at 2pm that needs to be deployed by the end of day. Usually it's bug fixes, and that's ok I guess, but sometimes it's brand new features. How the fuck am I supposed to do a good job in such a short time? I don't even have time to wrap my head around the details and I'm expected to implement it, test it, make sure it doesn't break anything and make it pass through code review? With still time to deploy and make sure it's ok? In a few hours? I'm not fucking superman!
2. Not being asked about estimates.
Everything is handed to me with a fixed deadline, usually pulled off my PM's ass, who has no frontend experience. "You have two weeks to make this website." "You must have this done this by tomorrow morning." The result, of course, is rushed code that was barely tested (by hand, no time for unit or integration tests).
3. Being the last part of the product development process.
Being the last part means that our deadlines are the most strict. If we don't meet the deadline, the client will be pissed. The thing is, the design part is usually the one that exceeds its time (because clients keep asking for changes). So when the project lands on our desks it's already delayed and we have to rush it.
This all sounds too much like bad planning to me. I guess it's the result of not doing scrum. There are no sprints, no planning meetings, only weekly status update meetings. Are your jobs similar? Is it just usual "agency work"?
I'm so tired of the constant pressure and having to rush my work. Oh, and the worst part is we don't have time for anything else. We're still stuck with webpack 2 because we never have time to update it ffs.6 -
Completed Angular 2 course on codeschool, really liked improvements and simplicity of Angular over Angularjs. Decided to do quick start guide in official website. Oh my f**king god... I need to setup webpack, typescript linter, typings, polyfills etc angular2-cli is no better, crawling with errors... why... why can't one just start a project and work instead spending loads of timing configuring all of that... AND WHY WE CANT HAVE PROPER SUPPORT FOR LATEST FEATURES...
I don't even know what I am ranting about... I just wish to spend more time creating things than configuring for ages development environment.7 -
Don't you just hate where we're going forward with these different JS frameworks and packages? WebPack, Electron and all the other ways we try to use JS for desktop development and a simple build of a tiny project taking 10 mins on an average spec core i7 machine, then overdosing on npm install since every frikn thing is now so modular you donwload a gazillion packages just to set up user authentication with a simple route manager in your app.
JavaScript is fine really for certain purposes. It's these other frameworks that try to modularize every single aspect of it that sucks. If there's anything called too modular, JS has reached it now. over-modularizing, and over-complicating everyday trivial tasks just to introduce yet another frikn package or framework.
Really missing the good'ol monolithic days of programming. I mean, modular is fine bro, but for godsakes draw the line somewhere!
#NoMoreOneLineModules3 -
Me setting up Webpack for a project
Error: can't resolve ./src
Guess what? ./src exists. So I go searching for an answer, and it turns out webpack looks for ./src/index.js and if it can't find it then it throws an error.
But the error message is: can't resolve ./src
The issue was reported ages ago but webpack devs never improved the error message
THIS IS WHY WEBPACK SUCKS 💩
Yes it might seem like a little detail but it just makes it all the more obvious that Webpack sucks right from the start when you set up a project the error message is stupid and unspecific3 -
Buckle up, it's a long one.
Let me tell you why "Tree Shaking" is stupidity incarnate and why Rich Harris needs to stop talking about things he doesn't understand.
For reference, this is a direct response to the 2015 article here: https://medium.com/@Rich_Harris/...
"Tree shaking", as Rich puts it, is NOT dead code removal apparently, but instead only picking the parts that are actually used.
However, Rich has never heard of a C compiler, apparently. In C (or any systems language with basic optimizations), public (visible) members exposed to library consumers must have that code available to them, obviously. However, all of the other cruft that you don't actually use is removed - hence, dead code removal.
How does the compiler do that? Well, it does what Rich calls "tree shaking" by evaluating all of the pieces of code that are used by any codepaths used by any of the exported symbols, not just the "main module" (which doesn't exist in systems libraries).
It's the SAME FUCKING THING, he's just not researched enough to fully fucking understand that. But sure, tell me how the javascript community apparently invented something ELSE that you REALLY just repackaged and made more bloated/downright wrong (React Hooks, webpack, WebAssembly, etc.)
Speaking of Javascript, "tree shaking" is impossible to do with any degree of confidence, unlike statically typed/well defined languages. This is because you can create artificial references to values at runtime using string functions - which means, with the right input, almost anything can be run depending on the input.
How do you figure out what can and can't be? You can't! Since there is a runtime-based codepath and decision tree, you run into properties of Turing's halting problem, which cannot be solved completely.
With stricter languages such as C (which is where "dead code removal" is used quite aggressively), you can make very strong assertions at compile time about the usage of code. This is simply how C is still thousands of times faster than Javascript.
So no, Rich Harris, dead code removal is not "silly". Your entire premise about "live code inclusion" is technical jargon and buzzwordy drivel. Empty words at best.
This sort of shit is annoying and only feeds into this cycle of the web community not being Special enough and having to reinvent every single fucking facet of operating systems in your shitty bloated spyware-like browser and brand it with flashy Matrix-esque imagery and prose.
Fuck all of it.20 -
There you are, fiddling with next.js webpack settings, because your isomorphic JS-in-CSS-in-JS SSR fallback from react-native-web to react-dom throws a runtime error on your SSR prerendering server during isomorphic asynchronous data prefetching from Kubernetes backend-for-frontend edge-server with GraphQL.
You have all that tech to display a landing page with an email form, just to send spam emails with ten tracking links and five tracking beacons per email.
Your product can be replaced by an Excel document made in two days.
It was developed in two years by a team of ten developers crunching every day under twelve project managers that can be replaced with a parrot trained to say “Any updates?”
Your evaluation is $5M+. You have 10,000 dependency security warnings, 1000 likes on Product Hunt, 500 comments on Hacker News, and a popular Twitter account.
Your future looks bright. You finish your coffee, crack your knuckles and carry on writing unit tests.5 -
I've kinda ghosted DevRant so here's an update:
VueJS is pretty good and I'm happy using it, but it seems I need to start with React soon to gain more business partnerships :( I'm down to learn React, but I'd rather jump into Typescript or stick with Vue.
Webpack is cool and I like it more than my previous Gulp implementation.
Docker has become much more usable in the last 2 years, but it's still garbage on Windows/Mac when running an application that runs on Symfony...without docker-sync. File interactions are just too slow for some of my enterprise apps. docker-sync was a life-saver.
I wish I had swapped ALL links to XHR requests long ago. This pseudo-SPA architecture that I've got now (still server-side rendered) is pretty good. It allows my server to do what servers do best, while eliminating the overhead of reloading CSS/JS on every request. I wrote an ES6 component for this: https://github.com/HTMLGuyLLC/... - Frankly, I could give a shit if you think it's dumb or hate it or think I'm dumb, but I'd love to hear any ideas for improving it (it's open source for a reason). I've been told my script is super helpful for people who have Shopify sites and can't change the backend. I use it to modernize older apps.
ContentBuilder.js has improved a ton in the last year and they're having a sale that ends today if you have a need for something like that, take a look: https://innovastudio.com/content-bu...
I bought and returned a 2019 Macbook pro with i9. I'll stick with my 2015 until we see what's in store for 2020. Apple has really stopped making great products ever since Jobs died, and I can't imagine that he was THAT important to the company. Any idiot on the street can you tell you several ways they could improve the latest models...for instance, how about feedback when you click buttons in the touchbar? How about a skinnier trackpad so your wrists aren't constantly on it? How about always-available audio and brightness buttons? How about better ports...How about a bezel-less screen? How about better arrow keys so you can easily click the up arrow without hitting shift all the time? How about a keyboard that doesn't suck? I did love touch ID though, and the laptop was much lighter.
The Logitech MX Master 3 mouse was just released. I love my 2s, so I just ordered it. We'll see how it is!
PHPStorm still hasn't fixed a couple things that are bothering me with the terminal: can't reorder tabs with drag and drop, tabs are saved but don't reconnect to the server so the title is wrong if you reopen a project and forget that the terminal tabs are from your last session and no longer connected. I've accidentally tried to run scripts locally that were meant for the server more than once...
I just found out this exists: https://caniuse.email/
I'm going to be looking into Kubernetes soon. I keep seeing the name (docker for mac, digitalocean) so I'm curious.
AWS S3 Glacier is still a bitch to work with in 2019...wtf? Having to setup a Python script with a bunch of dependencies in order to remove all items in a vault before you can delete it is dumb. It's like they said "how can we make it difficult for people to remove shit so we can keep charging them forever?". I finally removed almost 2TB of data, but my computer had to run that script for a day....so dumb...6 -
Right, that's fucking it. Enough. I'm all for learning new technologies, frameworks, and development protocols, but my time on this earth is limited and at the end of the day if I'm having to spend DAYS AND FUCKING DAYS just scouring through obscure forum posts because the documentation is shit and just hitting ONE FUCKING PROBLEM AFTER ANOTHER then there comes a point at which the time investment simply isn't worth it. I HATE throwing in the towel because some FUCKING CUNT code problem has got the better of me, but fucking sense must prevail here.
Laravel fucking Mix. Do any any of you use this shit on Windows? Because I take my fucking hat off to you. I'm done with it.
Oh, so your server uses 'public_html' instead of 'public' does it? Well, of course you can just set
mix.setPublicPath('public_html'); then can't you?
No, you can't. Why? Because fuck you, that's why. Not only do you have to hard-code your fucking public directory into each specified path, additionally you have to set
mix.setPublicPath('./');
Why? Because fuck you, that's why. It took me the best part of two days to discover that little nugget of information, buried at the bottom of some obscure corner of the internet in a random github issue thread. Fuck off.
Onto next problem. Another 5 hours invested to extract some patchy solution that I'm not at all happy with.
Rinse, repeat.
Make it work with BrowserSync by wrapping your assets like so:
<link rel="stylesheet" href="{{ mix('/build/css/main.css') }}">
Oh oh oh but "The Mix manifest does not exist"... despite a fresh install of Laravel 5.6 and all relevant node modules installed... follow some other random Github thread with a back and forth of time-consuming suggestions for avenues of experimentation, with no clear solution.
Er no, fuck off. I'm going back to Grunt and maybe I'll try Webpack/Mix in another year or two when there's actually some clear answers, but as it stands this a wild goose chase into a fucking black-hole and I've got better things to do with my precious time. Go die.5 -
Bug I had to fix today: some elements in our React app were being swapped with other elements.
We had `<foo>bar</foo>` on the component but on the html `foo` was being swapped with some other element in our app. It's contents ("bar" in the example) were being left in place, though, so we were getting `<baz>bar</baz>`.
This would only happen when running on production mode. On development everything was fine.
Also, everything seemed fine on the React dev tools. `foo` was where it was supposed to be, but on the html it was somewhere else.
Weirdest shit I ever saw when using React. I found a way to go around it and applied that fix, but I'm still trying to track this down to the source.
The worst part was waiting for fucking webpack to finish the production bundle on every fucking change I wanted to test. I didn't miss the change-save-compile-test flow at all.
What a shit day.4 -
I hate Sass.
When installing all NPM dependencies with npm i, it's always quick, but not with sass. Ooooh myy goood. It starts compiling. It always misses something. Your node version is always not what sass needs. It pulls out gyp which requires some native shit. The build is never reproducible, it always fails with some horrible two mile long poorly-formatted stacktrace that is just gibberish.
More than that, sass is just poorly designed tool used by frontend fuckboys to write imperative, nonstandard, non-maintainable styles. If you know shit about css, you don't need sass.
I'm so happy it's going to die along with gulp. Webpack and css modules are here.
Yes, css-in-js that has a runtime penalty is also shit. If you like its syntax but dislike everything else, use Linaria. It has no runtime penalty and looks just like other css-in-js solutions.14 -
I like webpack, but maybe not anymore after today.
Was working on my side project with already configured webpack and after some time I realised somethong is wrong with my styles, but it was not before.
Then I realised, that Chrome won't load CSS at all. I checked my source, but it seems to be perfectly fine. No errors while building. CSS is even included in the bundle generated...WHAT THE FUCK?5 -
Damn frontend crap.
The fact that you have to mask all of the disease with processable versions of css, html & js is bad enough, but there are like 6 dialects of each bandaid, and every project has traces of each.
The the design kid tells me to run this grunt script, frontender number two screams "no, dont use grunt, we use gulp! or was it bower? I guess just run it through yeoman, it's easy!", after which the third fucking shitty hipster yells "No that's outdated, just edit the webpack file, and then run yarn install... oh but run npm upgrade --global yarn first"
Did you just fucking tell me to upgrade a fucking package manager with another package manager?
Composer, gem or cargo are not always without problems. But at least us backenders have our fucking shit together. The worst we have to deal with is choosing Python 2 vs 3, or porting some old code so the server can migrate to PHP7.
The next person to tell me they found this awesome tool to manage his other tools... I'll fucking throw your latte all over your wacom tablet.2 -
The thing that I most hate is when you're approaching a new framework/tool, you follow the official documentation and the first example doesn't work.
I'm trying the official documentation of webpack, I tried the first example and guess! Error! It says that's probably a breaking change. Where the hell should I learn it? I don't have the crystal ball, should I guess how your fucking tool fucking works? Oh my god, it's ok if you introduced breaking changes, but just update all the references, is it so hard? -
So, I've had a personal project going for a couple of years now. It's one of those "I think this could be the billion-dollar idea" things. But I suffer from the typical "it's not PERFECT, so let's start again!" mentality, and the "hmm, I'm not sure I like that technology choice, so let's start again!" mentality.
Or, at least, I DID until 3-4 months ago.
I made the decision that I was going to charge ahead with it even if I started having second thoughts along the way. But, at the same time, I made the decision that I was going to rely on as little external technology as possible. Simplicity was going to be the key guiding light and if I couldn't truly justify bringing a given technology into the mix, it'd stay out.
That means that when I built the front end, I would go with plain HTML/CSS/JS... you know, just like I did 20+ years ago... and when I built the back end, I'd minimize the libraries I used as much as possible (though I allowed myself a bit more flexibility on the back end because that seems to be where there's less issues generally). Similarly, any choice I made I wanted to have little to no additional tooling required.
So, given this is a webapp with a Node back-end, I had some decisions to make.
On the back end, I decided to go with Express. Previously, I had written all the server code myself from "first principles", so I effectively built my own version of Express in other words. And you know what? It worked fine! It wasn't particularly hard, the code wasn't especially bad, and it worked. So, I considered re-using that code from the previous iteration, but I ultimately decided that Express brings enough value - more specifically all the middleware available for it - to justify going with it. I also stuck with NeDB for my data storage needs since that was aces all along (though I did switch to nedb-promises instead of writing my own async/await wrapper around it as I had previously done).
What I DIDN'T do though is go with TypeScript. In previous versions, I had. And, hey, it worked fine. TS of course brings some value, but having to have a compile step in it goes against my "as little additional tooling as possible" mantra, and the value it brings I find to be dubious when there's just one developer. As it stands, my "tooling" amounts to a few very simple JS scripts run with NPM. It's very simple, and that was my big goal: simplicity.
On the front end, I of course had to choose a framework first. React is fine, Angular is horrid, Vue, Svelte, others are okay. But I didn't want to bother with any of that because I dislike the level of abstraction they bring. But I also didn't want to be building my own widget library. I've done that before and it takes a lot of time and effort to do it well. So, after looking at many different options, I settled on Webix. I'm a fan of that library because it has a JS-centric approach. There's no JSX-like intermediate format, no build step involved, it's just straight, simple JS, and it's powerful and looks pretty good. Perfect for my needs. For one specific capability I did allow myself to bring in AnimeJS and ThreeJS. That's it though, no other dependencies (well, at first, I was using Axios because it was comfortable, but I've since migrated to plain old fetch). And no Webpack, no bundling at all, in fact. I dynamically load resources, which effectively is code-splitting, and I have some NPM scripts to do minification for a production build, but otherwise the code that runs in the browser is what I actually wrote, unlike using a framework.
So, what's the point of this whole rant?
The point is that I've made more progress in these last few months than I did the previous several years, and the experience has been SO much better!
All the tools and dependencies we tend to use these days, by and large, I think get in the way. Oh, to be sure, they have their own benefits, I'm not denying that... but I'm not at all convinced those benefits outweighs the time lost configuring this tool or that, fixing breakages caused by dependency updates, dealing with obtuse errors spit out by code I didn't write, going from the code in the browser to the actual source code to get anywhere when debugging, parsing crappy documentation, and just generally having the project be so much more complex and difficult to reason about. It's cognitive overload.
I've been doing this professionaly for a LONG time, I've seen so many fads come and go. The one thing I think we've lost along the way is the idea that simplicity leads to the best outcomes, and simplicity doesn't automatically mean you write less code, doesn't mean you cede responsibility for various things to third parties. Those things aren't automatically bad, but they CAN be, and I think more than we realize. We get wrapped up in "what everyone else is doing", we don't stop to question the "best practices", we just blindly follow.
I'm done with that, and my project is better for it! -
My first rant. Woohoo!
Honestly I do the whole shebang ussualy depending on what the needs are from network to servers to coding because for some reason nobody has any technical experience where I work.
I just started app development for a gamedev startup and I am in sheer awe of the amount of transpiling/compiling etc that needs to be done for an multiplatform app for iOS and android with js(x)/typescript, html, css.
I remember when I could just write some spaghetti code to make it working by following a couple of tutorials. Then refractoring and testing it for a couple of hours and be done with it. push it into production.
Now I am lost having to learn OOP, functional programming, reactjs, react native, express, webpack, mongodb, babel, and the list goes on and on...
Why not just make a new backend that does all of that in another language which supports all of that.
I have no formal education in programming/coding and the last time I learned JS it was just some if else, switches and simple dom manipulation.
I just want to get to coding a freakin' game but I have to learn JSX for the front and typescript on the backend.
I am this close to going back to ye ol' lamp stack and quitting this job. 😥5 -
How are Coding Bootcamps and what are they like?
A little background:
I’ve been going to a University (have a year left for a CS degree) and I am so EXTREMELY frustrated. I thought I would get an education but it’s so underwhelming. 95% of it doesn’t involve programming and the classes that do are so elementary that I know more than the professors. By the end of my web design course we had been taught to center text, insert images, insert links, and how to use tables with a single day on CSS using colors.
The OOP courses are all the same, learn variables, types, conditionals, loops, classes, functions, and so forth. Python, C++, and Java. I taught all this to myself when I was 15, I’m 29 now.
I’ve recently gotten extremely interested into full stack web development. .NET Core, React, Typescript. I’m also working with Electron. I’m basically 100% self taught and spend almost every waking moment trying to learn more and apply it.
There’s only one person at my school who has the same passion as me and he’s the president at the coding club but is going into machine learning and big data (I’m the Secretary) and I just wish I could interact with more people who have the same passion. I would love to be challenged. I feel as if I spend more time trying to learn and diagnose problems then applying my knowledge because web development is so complicated when it comes to connecting everything together and I’m still relatively new to it (started like 4 months ago). I’m an extremely fast learner and extremely dedicated so I’m not worried about that being an issue.
I just really want to be a part of a community where I have people who can answer my questions and I don’t have to spend hours or days on google finding a solution to integrating Webpack or using typescript with react, and more. I want to feel challenged.
Can I get this from a boot camp? I recently listened to a podcast from Syntax and it really excited me but I don’t want to be let down again. Either way I’m finishing my degree to get that bullshit $60000 piece of paper but I wouldn’t mind taking a couple months off for something like this if it’s worth it.
I live in CO so if you have any Bootcamps in CO that you recommend, I’d love to hear it and take a trip to check it out in person.
Thanks a bunch!10 -
Being a front end developer and working in a team of motivated "full stack" developers sucks big time.
So, recently joined this new company with a very small project which just started, basically a cloud version of a really old desktop app. Few people from the team completely from the asp dotnet background decided the architecture few months before I joined in.
So, they did it something like this -
- mono repo dotnet project with VueJs app served within it (because that would be maintainable 😑)
- vue app served by pointing the built files through dotnet index file (simply because they didn't care about the gift to the front end world which is webpack or even had any knowledge about it 😑)
- added typescript because, u know it's cool 😑, without even knowing that they don't possess that team which know how to write the types (f***ers write classes for every payload object coz they don't know what interfaces are)
- no loader to load typescript, they are running tsc in watch mode and we have .js and .js.map for every .ts file in our project which some teammates are even pushing to repo
Recently, I added eslint with git hooks to the project so that everyone will at least stick to the coding standards. Now, to avoid the errors they are bypassing the git hooks by uninstalling the library and then installing it after the commit😂😂
Then we have a girl who uses document.getElementById to programmatically change styles in a Vue project😑😑😑😂
Then we have dotnet people using dotnet coding conventions all over the front end app.
People, how do I deal with these so called "full stack" people?12 -
Oh my god, I'm basically at the verge of self-destruction! I've been trying all day to set up a simple Node server with react, but it's never that easy, is it? You need Babel to transpile ES6 + JSX to ES5, and then you need Webpack for god knows what reasons, and there are so man configuration files and options, and there are 1000 tutorials with 1001 ways to do something. I've created probably 20 new project because when I complete a tutorial and try to do something on my own, all hell is loose and I get some cryptic error message and am unable to ever get it to work. Holy cow, I need a drink... Am I just a retard? Greetings from Norway, by the way!7
-
I haven't done any front end stuff in a long time (last time was before jQuery was popular), and since I had some free time lately I decided to check out React and see what it's all about. Turns out that first I had to go trough one week of reading about node.js, npm, jsx, es6/es2015, babel, webpack (and probably something else), but I finally got to React. So far I had no problems with any of this but I have no fucking idea how most of this stuff works behind the curtains and I'm scared.3
-
Here, a full retrospective of my Apple products ownership.
iPhone SE – after Android, I was absolutely amazed by how fast it worked. No UI lags, camera works absolutely instantly no matter the light conditions, all the GPU-heavy games work butter smooth.
After camera and charging port failures on Xperia flagship and CPU literally melting through screen rendering it unusable on Meizu, it was enough to make me interested in Apple products.
When I was using Meizu, I actually got a twitching eye which was triggered by UI lags. After two months of using iPhone, I noticed that something was missing – my eye wasn't twitching anymore.
iPhone actually cured me.
MacBook 12 – a 900 grams laptop with passive-cooled mobile CPU running many Chrome tabs, heavy Webpack HMR build, VSCode and Slack just fine. Yes, you can't play games, but I don't even require it from a laptop this tiny.
Butterfly keyboard that internet hates so much actually increased my typing speed and comfort compared to MX Red mechanical keyboard, and ForceTouch trackpad made me forget about mouse. I learned how to disassemble the Butterfly keyboard if I ever need this but the keyboard never failed.
I use this laptop to this day and it still even smells like the day one, a beautiful smell of a new Apple product.
iPhone X – got it because of the camera, stayed for great battery life and amazing OLED display. I use telephoto lens exclusively and it made me lay off my Canon DSLR with Helios lens which stays on my bookshelf covered in dust to this day.
True black of OLED display which is undistinguishable from the screen bezel is stunning. To this day, battery surely works for one and a half days and I watch youtube really often.
I sometimes struggled to unlock iPhone SE with wet fingers, but with FaceID, as soon as I look at the screen the phone is unlocked. Works perfect every time, never had an issue with this.
Stainless steel body feels premium compared to aluminum. Stereo sound is a major selling point if you're like watching videos and playing games on your phone. Overall amazing product and a huge improvement over SE.
Apple Watch series 4 – really comfortable fit. Nice battery life, once I forgot about it for like ten days during lockdown and it was still working, even though on power reserve mode. Really reliable in terms of battery life and liquid protection. Very satisfying Taptic Engine crown clicks. I run every day and Apple watch always measure my heart rate correctly, and the running app is well designed and a pleasure to use. Overall a nice accessory to have if you use iPhone.
Powerbeats Pro – great sound and battery life. I switched from Shure SE215 which was great, but it had wires. I listen to a lot of music so the sound quality is important for me. When I was choosing earphones I visited a store where you can listen to them all. I listened through earphones like Noble Audio Kaiser Encore and JH Audio Layla, and of course $4000 Laylas sound better than $249 bluetooth earphones, but the difference in sound doesn't justify the difference in price to me.
Powerbeats pro is the Apple H1 chip true wireless earphones with largest driver of them all which makes them sound better than AirPods Pro – it's just physics. Bass in Powerbeats is amazing, which is also true for my Shures, but Powerbeats also win in clarity.
It connects seamlessly to both my MacBook and my iPhone, and everyone in voice chats can hear me really good.
Huge case is a major throwback compared to AirPods, but the battery life of earphones themselves is so great that I just leave the case at home and only carry earphones and it works for me.
Apple Link bracelet in space black – really better than I expected. Intricate detailing, literally the steel that Rolex uses, top-notch finishing and polishing – all that for just 450 dollars. I only used it for several days now, but it already feels like a really satisfying product.
Before all that I was using Linux. It took a year for elementaryos devs to fix wifi for my laptop. Ubuntu looks and feels ugly. Pop OS felt like garbage. Manjaro was also just that – garbage. KDE Plasma – I don't even want to talk about that. A monstrocity where you accidentally click a wrong switch in the settings and your system won't boot up again. Also, PulseAudio. Struggles with proprietary drivers and software updates.
Windows? I serviced a lot of Windows PCs through my career and it never, never worked as intended. I'm no dumbass, I always managed the rights correctly and never installed sketchy apps. My latest ryzen gaming build with a lot of ram also lags somehow even in Windows 10 UI.
Before I switched, I defended Linux.
My life was a lie.
I'm sorry to everyone who I offended based on their opinion on Linux.33 -
!rant but kinda
Rails 7 got rid of webpack and Node as a requirement, and for this I am super happy. I heavily disliked having to depend on Node for what is in fact a Ruby framework. I understood the need for it, and I always applaud Rails for being at the forefront of the web dev world and all of the trends that it contains. But maintaining both the node modules required, plus the gemfiles etc was just a big hassle for the simple projects I ever worked on.
This is coming from someone that actually likes JS and Node, but I am thankful this was decoupled.6 -
I just don't get it. I've done web stuff for 20 years, but these days I'm expected to learn god knows how many command line tools just to stay relevant in the field. I fear the day I have to leave this crummy company making small websites, I just don't have what it takes to learn all that shit and get a job elsewhere.
Webpack, NodeJS, Angular... when I look at their docs I just get lost in all the jargon and I think to myself: I would rather stock shelves like a chum then learn all this goddamn shit over and over and over, my generation can't afford shit anyway so there is no point in doing the absolute minimum to survive.
Meanwhile the recruiters on LinkedIn all talk like the jobs they have are like a visit to fucking Disneyland compared to the soulless mindfucking grind a job entails. GAHHHH!1 -
Lessions I learned so far from my first big node/npm project with tons of users:
1) If you didn't build something for a while, expect 3 hours of resolving version conflicts for every two weeks since the last build.
2) Even if the tests pass, run the containers on your own machine and make sure that the app doesn't randomly crash before deploying
3) Even if the app seemed to work on your own machine, run the tests again in an environment mimicking prod at most 15 minutes before replacing the running containers.
4) Even if all else indicates that the app will work, only ever deploy if you expect to be available within the 4 hours following a deployment.
5) Don't use shrinkwrap for anything other than locking every version down completely. A partial shrinkwrap will produce bugs that are dependent on the exact hour you built the app _and_ the shrinkwrap file, and therefore no one will ever have seen them other than you.
6) Avoid gyp, and generally try not to interface too much with anything that doesn't run on node. If parts of your solution use very different toolchains, your problems will be approximately proportional to the amount of code. And you'd be surprised just how much code you're running. (otherwise it's more logarithmic because the more code the less likely a new assumption is unique)
7) Do not update webpack or its plugins or anything they might call unless you absolutely need to
8) Containers are cool but the alpine ones are pretty much useless if you have even just one gyp module.
9) There's always another cache. To save yourself a lot of pain, include the build time in every file or its name that the browser can download, and compare these to a fresh build while debugging to assert that the bug is still present in the code you're reading
+1) Although it may look like it, SQLite is far from a simple solution because the code and the bindings aren't maintained. In fact, it'll probably be more time consuming than using a proper database.3 -
Why does everything installed via npm sux so hard?
Why the fuck does any minor update in their bullshit packages either forces you to change config files:
E.g. now should be "@babel/core" instead of "babel-core" - WHAT A FUCKING SIGNIFICANT CHANGE!!! Rewrite all you configs motherfucker, that goddamn "@" in front of our shit is SO IMPORTANT that we will break everything to add it
Or breaks the code internally:
Consider the recent fail of fucking Terser [https://github.com/gatsbyjs/gatsby/...] that breaks fucking webpack and FORCE YOU TO ROLLBACK TO ANY VERSION THAT WORKS, why you nerd retards, can not run a simple dummy project BEFORE YOU RELEASE YOUR SHIT???!?!!?
Why any fucking update from *.*.1 to *.*.2 turns into hours of googling of what the fuck got broken this time??
The way that webpack, babel and other npm packages are released nowadays is absolutely retarded. I really have a strong feeling that it is better to keep old error-proof working config and NEVER UPDATE, than constantly suffer from butthurt
p.s.
Of course I am sorry for all the hate and caps in my post, and have respect for guys that develop amazing stuff for us for free, but I need to share this5 -
I am a fresher in web development. I have already learnt to use nodejs, react, angular, vanilla js and made many projects. Majority of the work I feel is just CRUD based, sure there are some exciting things but they are only of a small percentage.
All that innovation HAPPENING is just glorified way of making a CRUD APP ONLY.
Oh mvc worked great on server side let's bring it to client side
OH mvc is such a mess, who thought about doing this.
Oh react redux is so revolutionary let's remake our app using it,,
Oh es6 fuck yeah, Babel, webpack sure, now my crud app is super performant.
Oh graphql, motherfucking cutting edge CRUD APP......
I need to know what's next, is there any breaking of this cycle11 -
Rust's DX is incredible. I previously published a couple packages to NPM and every step of the way i had to fight with NPM, Webpack, Rollup, Typescript and the mass of third party plugins for all of these that wired them together. Here it's literally just
cargo publish5 -
Why the fuck nobody talks about Multi-page apps?! We went from a Web where everything was Multi-page server-rendered, and now everything for Web developers is "Single-page apps".
What about websites who can't do that? Not everything can be a single-page app. Only my uncle's restaurant website, or something which is TRULY a full app. No half choices.
If your website is a multi-page app/portal which actually PRELOADS data, instead of doing 100 fetch to an API within a page that is full of loading bars, well, your life is a pain.
When you want a first contentful paint which isn't a white page, well, your life is a pain.
What are React, Vue, Ember, Angular (let's exclude Svelte and Marko) going to do about Multi-page apps and SSR?
React-router sucks to me. It's performance is weak and it's useful only when you have an SPA with multiple sections which can be treated as pages (e.g. A single SPA divided in tabs).
Server-side rendering is the worst pain ever made by humanity, in React (and prob Vue, I didn't try but I can bet). And even when made easier from libs like Svelte and Marko, I (personally) can't get it to be faster enough compared to a traditional website without a JS framework and with a templating engine.
Anyways, if there's anything that I learnt from React, is to stay away from Next.js. Perfect, beautiful, mess.
All JS frameworks just seem to bloat the code and make it worse and slower, even though they're REALLY helpful.
Why? Why everyone loves them if their downsides are so clear? Why 3 projects out of 3 I made (1 React SSR, 1 Vue, 1 Marko SSR) are and will stay painfully slow and bloated, full of shit, even if in 2020 we should have evolved with the famous three shaking, with the famous lazy loading, etc.?
I am just frustrated.
And let's not even talk about Webpack, Rollup, Lasso, those module bundlers shit which are harder to configure and understand than finding a needle in a haystack.
Lasso was the easiest to configure but I anyways can't understand it. Webpack seems it was made to handle SPAs, as any tool in this freaking world, and not even considering an easy way to integrate multiple bundles for multiple pages (I know it's pretty easy, but with component sharing between pages and big unique bundles Next.js handles it soooo bad it feels like hell).
Am I the only one?
Sorry for the long rant. I just needed to rant right now.17 -
I have one full stack dev, who claims to know Python and Webpack, but the funny thing is that he is complete shit in anything he does
As he is working in office and I work remotely, CEO and CTO give all his doings a priority
The most fucking part was when he left a project for 2 weeks and when came back he told that nothing had changed.
... he didn't even look to the code, or running website, he just told thst nothing was done
I was so insane, that I told him almost everything I think about him
Fortunately, I am still on this job and he in not working on this project =D -
Last weekend I was working on a small project for a friend of mine: a dockerized webapp, plus API backend and DB. I had some problems with the installation on the vps and had to try out different images and never really did a complete setup of my usual dotfiles. Got it running on an Ubuntu distro. Everything great.
It was the first release so I still had to check that every configuration worked ok, like letsencrypt companion container, the reverse proxy and all that stuff, so I decided to clone the whole project on the server tho make the changes there and then commit them from there.
Docker compose, 10 lines of code, change the hosts and password. Boom everything working. Great... Except for the images in the webapp.
WTF? Check the repo, here they are, all ok. I try different build tactics. Nothing. Even building the app on another docker always the same. Checked browser cache, all the correct ports are open. I even though that maybe react was still using some weird websocket I didn't know, but no.
Damn, I spent 5 hours checking why the f*** the server wouldn't make it out.
Then, finally, the realization...
I didn't install the f******* git-lfs plugin and all I was working with were stupid symbolics links! Webpack never even throw an error for any of the stupid images and the browser would only show a corrupted image, when decoding the base64 string.
Literally the solution took 5 minutes.
F*** changes on production, now I do everything on a fully automated CI. -
Front-end web development is like a fucking cancer to me right now
I need the following behavior from my development environment if I don't want the webdev experience to destroy my sanity and tempt me into suicide by making me waste my valuable lifetime configuring shit that is ultimately meaningless to the software I'm trying to create:
- I should be able to open the webpage in the browser at localhost:<some-port>
- the page should refresh immediately as I save my files
- I should be able to import node modules installed with npm without using a script tag linking to some CDN (for instance, I want to do a get request with axios instead of the fetch API)
- I should be able to do this without spending more than two minutes reading the documentation for a tool that would enable me to do it, ideally without ever coming even close to touching a configuration file
Right now I know about browser-sync and webpack, or webpack-dev-server or some such fucking shit fuck fucking fuck.
browser-sync seems to fulfill most of these needs, except that I can't seem to bring npm modules into my application and import them. Webpack seems to be able to do this, but at the cost of slowly throwing my life away reading documentation for over-complicated configuration files that do not aid me in actual software creation and therefore do not interest me and never will, all in the hope that I *may* at some point dig out enough shit to find how to do such a use case (i.e. seamless, smooth web development) that to me feels reasonably common and expected.
Is there some tool that enables me to do *seamless*, pleasurable web development without the hassles of over-complication and over-engineering? Is there some hidden command for webpack that allows me to run such simple shit without ever needing to edit some pointless configuration file?
Please, I beg of you, let me know.8 -
Webpack? More like Fudgepack 😡
OK sure, I know it's cool to rip on Webpack without taking 5 minutes to understand it, but I really have tried. Every time I want to do anything which used to be trivial with grunt, gulp or brunch, it requires a whole bunch of sorcery and every post I see online around the same topic inevitably ends with something like "that's not modular", "WebPack doesn't work like that", "you're holding your phone wrong" etc. And it's not like I'm someone who is afraid of new or uncomfortable things. I try new languages almost as often as there are new JavaScript fads (OK maybe not THAT often). I use "weird" keywords and experiment with different key maps all the time. I swap my daily window manager on an almost quarterly basis (and xmonad is no picnic as an introduction to Haskell). But what the fuck is it with so many people in positions of influence in the frontend world always taking one step forward, two steps back and an occasional hop sideways when it comes to tooling (and dragging everyone else along with them)?
How did such a turd of a tool become defacto for so many frontend frameworks? Do hard core JavaScripters just really really hate outsiders and want to deter others from their precious as much as possible? Fuck Webpack and fuck everyone responsible for helping it permeate so thoroughly through the software development industry.2 -
I feel so dirty rn. Been struggling with webpack all day to just generate some pages based on the object a js script exports. The issue was that I needed a path to an image and the path webpack's require returned was a relative path (it started with a .), which wouldn't work because my generated page wasn't in the root folder. I tried making it work "the right way" all day, nothing worked. So in the end I just removed the . from the fucking path using substr and that's that.
Also, why the fuck does webpack's require return a fucking relative path anyway?1 -
In most businesses, self-proclaimed full-stack teams are usually more back-end leaning as historically the need to use JS more extensively has imposed itself on back-end-only teams (that used to handle some basic HTML/CSS/JS/bootstrap on the side). This is something I witnessed over the years in 4 projects.
Back-end developers looking for a good JS framework will inevitably land on the triad of Vue, React and Angular, elegant solutions for SPA's. These frameworks are way more permissive than traditional back-end MVC frameworks (Dotnet core, Symfony, Spring boot), meaning it is easy to get something that looks like it's working even when it is not "right" (=idiomatic, unit-testable, maintainable).
They then use components as if they were simple HTML elements injecting the initial state via attributes (props), skip event handling and immediately add state store libraries (Vuex, Redux). They aren't aware that updating a single prop in an object with 1000 keys passed as prop will be nefarious for rendering performance. They also read something about SSR and immediately add Next.js or Nuxt.js, a custom Node express.js proxy and npm install a ton of "ecosystem" modules like webpack loaders that will become abandonware in a year.
After 6 months you get: 3 basic forms with a few fields, regressions, 2MB of JS, missing basic a11y, unmaintainable translation files & business logic scattered across components, an "outdated" stack that logs 20 deprecation notices on npm install, a component library that is hard to unit-test, validate and update, completely vendor-& version locked in and hundreds of thousands of wasted dollars.
I empathize with the back-end devs: JS frameworks should not brand themselves as "simple" or "one-size-fits-all" solutions. They should not treat their audience as if it were fully aware and able to use concepts of composition, immutability, and custom "hooks" paired with the quirks of JS, and especially WHEN they are a good fit. -
tldr: Fuck webpack with a big rusty pipe.
I have a class and in the construct a method is called with an imported value as the argument. This imported value is declared like this:
export const EXT = 'whatthef';
Seems like webpack moves things around in such a way that this constant isn't aceasable in all contexts.
Spent a good 4 hours figuring that out 🙃2 -
Modern Web Developer
(To the tune of "I Am the Very Model of a Modern Major-General" from Gilbert and Sullivan's "The Pirates of Penzance")
I am the very model of a modern web developer
I’m quite fluent with JavaScript; An HTML whisperer
My code is clean and elegant, I genuinely innovate
And even know my way around a Promise and async / await
I’m very well acquainted too with matters vector graphical
I understand why SVG coordinates seem magical
And even without Photoshop I elegantly can produce
A mockup or a logo in most any format that you choose
[Chorus]
A mockup or a logo in most any format that you choose
A mockup or a logo in most any format that you choose
A mockup or a logo in most any format that you choose
I'm quite adept at ES6 expressions like destructuring
I know the ins and outs of functional reactive programming
In short, in matters browser-based or Node.js if you prefer
I am the very model of a modern web developer
[Chorus]
He is the very model of a modern web developer
I know our mythic history, the humble start, the browser wars
I know why Douglas Crockford fought the battle over ES4
The World Wide Web Consortium and Ecma International
My knowledge of our legacy is truly supernatural
With LESS and SASS and CSS, designing for mobility
I’ll perfectly apply the right amount of specificity
From custom fonts and parallax to grid and flex and border-box
I know most every tip and trick both common and unorthodox
[Chorus]
He knows most every tip and trick both common and unorthodox
He knows most every tip and trick both common and unorthodox
He knows most every tip and trick both common and unorthodox
And when it comes to lazy loading, bundling up and splitting code
There’s nothing quite like Webpack, which of course is built on top of Node
Considering my resume, I’m certain that you will concur
I am the very model of a modern web developer
[Chorus]
He is the very model of a modern web developer
When new frameworks and libraries emerge I must be ravenous
And gobble up the hot new thing, my appetite is bottomless
React and Vue and Angular, Immutable, RxJS
The list will be outdated long before I'm finished singing this
My pull requests rely on multitudinous utilities
To help me lint and test and build, a deluge of analyses
And every single day there are a hundred thousand more to learn
The web is going through an irresponsible amount of churn
[Chorus]
The web is going through an irresponsible amount of churn
The web is going through an irresponsible amount of churn
The web is going through an irresponsible amount of churn
This pace is agonizing! Code from yesterday is obsolete!
The speed of innovation is enough to knock me off my feet!
It's happening too fast! I can’t keep up! I’m tired! It’s all a blur!
I am the very model of a modern web developer!
[Chorus]
He is the very model of a modern web developer!1 -
Since a friend of mine owns a domain for an open-source project and manages pretty much everything, including dealing with a db for registered accounts, I'm currently not really able to help when it comes to UI/UX things and frontend, besides the "main editor", which is like the core functionality of the project. I would like to set up smth like docker (on Windows 10 home, which is already not suitable, great start🤦) for some kind of pseudo-db all inclusive functionality thingy to be able to run a working example locally. Also a goal would be to switch to Typescript, include testing, to use webpack and to automate as much as possible.
Sad part is, I don't even know where to start and I'm also 100% sure that I will do almost everything wrong from research to implementation.😐rant personal project simulate locally where do i even start webpack and all that struggle to start docker1