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 - "js html"
-
We can compile, transpile, and do all sorts of fucky internet things through an entire development pipeline and then troubleshoot through all sorts of hackery and dev sorcery to output html.
Or I can just index.php and be done with it.
I dunno man, I dig frontend and using the popular js libs to put shit online and be done without having to deal with the fuckery that is wasm or use something similar to Rust to bring shit to my clients.
9 times out of 10, these dudes have been well served with the php or node or even golang that i give them.
Seems that a lot of tools coming up just make shit harder.
Even VBScript seems simpler compared to the amount of web fuckery going on right now.
Yeah I keep current, but fuck, every day it seems as if shit was just getting more and more complex16 -
It's official, the "front end dev" doesn't know how to code.
Why.
And it's not a "Well I don't know JS because I use React." scenario, no. He has almost no idea of coding.
What was he thinking trying to build the front end of a very complex app with just HTML, CSS and stupid copied and pasted snippets?5 -
Why the hell is JS so terrible, and why do so many people resort to using is as a back end. So many packages, so many outdated dependencies. My coworkers and friends have heard me rant about my constant frustration with this terrible setup.
I understand the need for dynamic html but why have we bastardized this language to the extent we have.
Keep your projects up to date, it saves people a lot of trouble in the future.11 -
A long long time ago ( 2007 I think ) I worked for a company that made landing sites, so basically an email campaign would go out, users would be sent to a 1 page website with a form to capture their data, ready to be spammed even more. You know how it was back then.
So I worked with a guy who we had just hired, I didn't do the hiring but his CV checked out, so I gave him one of my tasks. Now most pages were made with js and html, with a PHP backend ( called with Ajax). Now this guy didn't know PHP so I was like all good, ASP works too at the end of the day we don't judge, we do like 2 or 3 of these a day and never look at them again. So he goes of and does is thing.
3 weeks later, the customer calls up to me they still haven't received their landing page. Ok so he probably forgot to email the customer np, I tell him to double check he has emailed the customer. Another week goes by end the customer calls back, same problem. At this point I'm getting worried, because we're days away from the deadline and it was originally my task.
So I go back to the guy and I tell him I want that landing page so I can send it myself, half thinking to myself that we had a freeloader, that guy that comes in to companies for 3 weeks, doesn't work, but still cashes his pay. But no, this was much worse.
So he tells me he has finished yet. I ask him why, what's the blocker ? You had 4 weeks to tell me you were blocked and couldn't progress. And his answer was simply, because I wasn't blocked I have been working on it this whole time. So I tell him to zip his project up and email it to me. We didn't do SVN or git back then, simply wasn't worth it. So he comes back to me and says the email server is telling him attachments can't be bigger then 50mb. At this point I'm thinking he didn't properly sized the art or something, so I give him a flash drive to put it on.
When I then open the flash drive, the archive is 300mb, thinking to myself, the images weren't even that big to begin with.
So I open it up, and I don't even find any images, just a single asp page. About 500mb. When I opened that up and it finally loaded, I saw the most horrendous things ever.
The first 500 lines was just initializing empty vars. Then there was some code that created an empty form with an onChange event that submits the form. After that.. it was just non stop nested if's. No loops, no while, for, foreach, NO elseif's, just nested if's, for every possible combination of the state the form could be in. Abou 5000 of them, in a single file. To make matters worse, all the form ( and page ) layout was hardcoded in the if's. Includes inline css, base64 encoded images, nothing but as dynamic, based on the length of the form he changes the layout, added more background etc. He cut the images up for every possible size of the page and included them in the code.
I showed it to my boss, he fired the guy on the spot. I redid the work from scratch, in under 4 hours. Send it to the client. they had no ammends to make, happy as Larry. Whish I kept the code somewhere.
Morale of the story, allways do a coding test on interviews, even if small things just to sanity check.4 -
A few days ago, a guy sent me a message on Fiverr asking me to create a website.
The good joke is that they are two engineering students who want me to do their programming exercise.
The nerve.2 -
Hello there. I'm a junior frontend developer, and I'm starting to think that IT is not for me.
Okay, first things first. This story/rant might be a bit longer than I previously thought, but whatever... :p
I started working in frontend about a year ago.
Now the problem is, that I'm absolutely rubbish with coding, and I'm starting to think that it might have something to do with my personality. While I loved (and still do) doing HTML and CSS, and maybe some JS as well, when it comes to working with frameworks, build tools, TypeScript, and all this *****, I just want to stand up and carefully smash the keyboard through the display. I can't stand the constant cryptic error messages and gazillions of config files, and don't even get me started with TypeScript. This is not how I imagined what programming is like - I know it's my fault, I was a bit naive. I still love making simpler things in HTML/CSS/JS and playing around with Linux, but I lost my will to do any of these even in my spare time. I don't have the patience to feel incompetent all the time with the promise that in a few years, doing this rubbish 8 hours a day, I will get better at it. Some colleagues even talked about it being like Lego and getting into the "flow": yeah... not in my case. There's nothing creative in this, it all feels like a factory line where I have to do the line work but also configure the machines as well...
The funny thing is, I made about the same amount of money working in less prestigious jobs. Sure I didn't like any of them, they were tiring and boring as hell, but at least they were not stressful and frustrating. I'm seriously considering moving to Western Europe and working as a bicycle delivery guy in the Alps, a postman, a waiter, or literally anything else that has something to do with the real world, and leave programming to the actual software engineers (who I deeply respect by the way).
I'll probably add more to this, but I need to go now and meditate a bit. :D11 -
Made my first game last weekend, in a Hackathon.
Had to build either a Pong clone or a Space Invaders one. Went with the later, and used Phaser. So pumped up! :D
You can check it here: https://cantarim.itch.io/intruders-... -
Sharing a first look at a prototype Web Components library I am working on for "fun"
TL;DR left side is pivot (grouped) table, right side is declarative code for it (Everything except the custom formatting is done declaratively, but has the option to be imperative as well).
====
TL;DR (Too long, did read):
I'm challenging myself to be creative with the cool new things that browsers offer us. Lani so far has a focus on extreme extensibility, abstraction from dependencies, and optional declarative style.
It's also going to be a micro CSS framework, but that's taking the back-seat.
I wanted to highlight my design here with this table, and the code that is written to produce this result.
First, you can see that the <lani-table> element is reading template, data, and layout information from its child elements. Besides the custom highlighting code (Yellow background in the "Tags" column, and green gradient in the "Score" column), everything can be done without opening even a single script tag.
The <lani-data-source> element is rather special. It's an abstraction of any data source, and you, as a developer can add custom data sources and hook up the handlers to your whim (the element itself uses the "type" attribute to choose a handler. In this case, the handler is "download" which simply sends a fetch request to the server once and downloads the result to memory).
Templates are stored in an html file, not string literals (Which I think really fucks the code) and loaded async, then cached into an object (so that the network tab doesn't get crowded, even if we can count on the HTTP cache). This also has the benefit of allowing me to parse the HTML templates once and then caching the parsed result in memory, so templates are never re-parsed from string no matter how many custom elements are created.
Everything is "compiled" into a single, minified .js file that you include on your page.
I know it's nothing extraordinary, but for something that doesn't need to be compiled, transpiled, packaged, shipped, and kissed goodnight, I think it's a really nice design and I hope to continue work on it and improve it over time1 -
To the reactjs-centered fucks who develop the popular web component viewing software called storybook: have you ever heard about semver?
89 alpha/beta/rc releases for a minor update 6.3 -> 6.4 with "100's of fixes and enhancements" "in preparation of the HUGE 7.0 release". Gee I wonder will it have 1000's of bugfixes? How bug-ridden is this software?
Every minor upgrade since 5.x is backwards-incompatible and requires a day of frustration finding out in how many more fucking NPM packages you split your codebase just because it's cool. I know move fast and break things, but some of us have other things to do than resolving node_modules incompatibilities you know. "No just hit 'npx sb upgrade' you say". I did, I really did! And the browser showed a blank screen of death with tons of cryptic React errors, it really did! Thank God you abstracted away all your dependencies in that sb command, now you can't even read the docs about what could have gone wrong with a specific sub-package. You have @storybook/html but the docs redirect to React pages, so good luck if you use something else
This is so sad... like.. the IDEA of storybook is great. But why did faith put the capacity to develop such a tool into the hands of people who think the world centers around React and JSX.. HTML should have been the default, and then you build on top of that for your fav framework, not the other way around -
The day I realised There is an AngularJS before Angular 2
In our t ch stack, we have multiple components, most of them are backend, but 2 of them are fronnt end.
The first one is a straight Angular 4 application, and it has the normal angular structure, a ts file, a css file, a js file.
The other component, has a very weird structure I don't understand to this day.
It has a mix of js and html files, sometimes one inside another.
The js file has some "angular.core.shit" and I thought it should be Angular, but nothing in it resembles any angular project.
After much confusion, I finally came across an AngularJS website which is supposed to be deprecated last year.
Then I came to know of the story of Google taking ove rAngular and releasing Angular 2.1 -
I might be new to webdev , but wtf is wrong with imports in js ?
html seems to get the only decent way of dealing with js: all the files mentioned in subsequent <script> tags can access the functions of previous file
but when it comes to those generated html content(aka react projects) and servers, nobody seems to come to an agreement : react guys uses import while server people uses require. and both of these can't be used in the same file : import works in mjs files (or usual files too if type is defined as module) while require works in cjs file (or usual js files if type is NOT defined as module)
so i kind of like imports for its elegance and resembelence to java imports. and i might have got into some errors in unrelated areas , so my package.json has type=module . i want to use some cjs package (jsonwebtoken) and that shit for the love of god won't work with import, so i gotta use it with cjs file and then the whole project can't use that crappy cjs file.
WTAF ? has web world not got matured enough to not have this shitty import export situation?should i write caveman code and convert everything to require(..) ?
fuck me2 -
stateofjs survey reminds me of all that's wrong with JavaScript: too many frameworks each of which has to reinvent the wheel and depend on too many node_modules child dependencies, most don't support TypeScript properly (ever tried to convert a node-express-mongoose tutorial to TS?), there is still no proper type support in JS core language, and browser features get added in form of overly complex APIs instead of handy DOM methods.
Instead the community gets excited about micro-improvements like optional chaining which has been possible in other languages for decades.
At least there is something like TypeScript, but I don't like its syntax either, it's overly verbose and adds too much "Java feeling" to JavaScript in my opinion.
Also there is too much JS in web development, as CSS and HTML seem to have missed adding enough native functionality that works reliable cross browser to build websites in a descriptive way without misunderstanding web dev for application engineering.
After all, I'd rather have frontend PHP than more JavaScript everywhere.
Anyway, at least the survey has the option to choose how satisfied or unsatisfied people are about certain aspects of JS. But I already suspect that most respondents will seem to be very happy and eager to learn the latest hype train frameworks or stick to their beloved React in the future.5 -
I need suggestions
I’m thinking about making a blog called but how do I, this will include tutorials that covers things not taught in school, but you wished you knew how to do.
So right now I have ideas like:
How to write zsh plugins
How to scrape the web(scrape html or sending request)
How to write chrome plugins
How to center a div in different ways
How to write backend codes in js
How to setup an interactive website on a server with domain
But I need more, I need suggestions.8 -
I’m too dumb to learn frontend frameworks.
I’m a backend developer, not the greatest but I get the work done. I can understand different programming languages even if I don’t write in them, you just understand basic principles and know what’s going on.
I can do some work in HTML, CSS and some JS.
But what the hell is with those popular frontend frameworks. I thought I pretty much understand how it works, so started doing some crap on my own, some pretty responsive navbar with dropdowns to start. Nevermind a million of npm packages to just start working and some weird errors in website source (“JavaScript is not enabled”, I spent few hours trying to fix it, but it’s just there, everything is working fine even with this message there). I have pretty navbar, nice, time to add dropdown.
Nope, not working. Maybe classic css solution?
Nope.
Ok, time to Google. What do I find? A million of npm dependencies that provide dropdowns, for some you need to pay, wtf.
But I want to write one on my own.
Found few tutorials that wasn’t even remotely helpful, it’s like with the online recipes, “when I was growing up on the farm…” and then something that it’s not working.
Finally found some nice looking tutorial, was following that and then.. it ended. It was maybe half of the solution, dude forgot about some components and just left.
I quit, I’m going back to writing jsp, my brain is too smooth for frontend frameworks2 -
Browser automation is a PITA. I’m going on my fourth side mission with this crap and I honestly still look like a newbie. I’ve tried Java Selenium with Chrome, Excel VBA with IE9, Vanilla JS in the browser console, and tonight I’m thinking to concoct some kind of hybrid CDP & Selenium approach in Chrome. Never used CDP before, not even sure where to start but I heard it sucks like anything else unless you get some extra libraries and plugins and stuff.
It doesn’t help that I can’t get just anything I want from our IT Department. It would be another PITA to ask for puppeteer. If puppeteer is totally legit please let me know.
Selenium sucks. The buttons don’t click, the waits don’t wait. Its unusable. Iframes are annoying as all hell but I can deal with that. HTML Tables suck too. It doesn’t help I have to restart my whole java program and whole Chrome every time an element doesn’t get picked correctly. Scripting one single element can take all fucking night.
Chrome dev tools what the fuck. Why the fuck is the DOM explorer in the same window as the web page I’m working on?? I can’t undock it. Am I supposed to use a fucking TV screen to work with this bastard?? If I use the remote chrome tools on port 9225 or whatever - It Still Renders The Whole Fucking Page Alongside The Console. Get Out Of My Way!!! The nested HTML CODE IS ONE CHARACTER WIDE ALL THE TIME. I can’t for the life of me figure out what the fuck I’m looking at. Haven’t you people ever heard of A HORIZONTAL SCROLL BAR at least.
Fuck I tried using getElementById, and the Xpath thing and its not all that great seeing I have seemingly 1000s of nested Divs all over the god damned place oftentimes containing a single element. I’m finally on chrome now should I learn Jquery now? I mean seriously wtf.
I use this one no code tool for dev it has web automation built in. As you can imagine its just as broken as anything else!! I have 10 screens to navigate it gets stuck on the second screen all the damn time. Fuck I love clicking the buttons when my script misses and playing catch up with it.
So as a work around to Selenium not waiting even 1 millisecond when I use explicit wait or implicit wait or fluent wait, I’m guessing maybe I can attach both Chrome Dev Tools Protocol (CDP as ive called it earlier) and selenium to the same browser and maybe I can use CDP to perform a Wait with any degree of success. Selenium will do nothing more than execute vanilla javascript Element.click(); This is the only way I know to even ACTUALLY use selenium beyond the simplest html documents possible. Hell I guess CDP can execute js idk.
I can’t get the new selenium that has CDP but I do have some buggy ass selenium from a few years back. Yeah, I remember reading there was a pretty impactful regression defect in the version I have. Maybe I’m being gaslighted by some shit copy of selenium?
The worst part is that I do seem to be having issues that the rest of the internet’s devs do not seem to be having. People act like browser automation is totally viable and pretty OK. How in the fuck hell is my Selenium Test Suite going to be more reliable my application under test?!!?? I’ll have more fucking bugs in my test suite than in my application. Today, I have less than half a test script and, I. already. fucking. do.
I am still SUPER PISSED at the months of 12 hour days (always 8 hours spent on normal sprint work btw only 4 to automation) I spent trying to automate our regression tests. I got NOWHERE.
I did learn a lot about HTML and JS though like I’m not that mad…but I’m just trying to emphasize my achievement on my task was zero.
The buttons don’t click. There are so many divs and I swear you sometimes need to select a div somewhere in the middle sometimes to get it working. The waits don’t wait. XHR requests are invisible. Java crashes 100 times before I find an xpath and thread.sleep() combo that works. I have no failure modes to use — Sometimes I click the same element 20x in a script because I have no way to know if it clicked the first time! Sometimes you gotta scroll the page to make the click work. So many click methods all broken. So many wait methods all broken. Its not just the elements don’t click! There are so many ways to click that almost work but surely they all fail the same in the end. ok at this point I’m just repeating myself…
there yet even more issues that I can’t remember…and will soon remember as I journey into this project yet again…
thanks for reading I hope I entertained and would love to hear your experience!7 -
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. -
A year ago I built my first todo, not from a tutorial, but using basic libraries and nw.js, and doing basic dom manipulations.
It had drag n drop, icons, and basic saving and loading. And I was satisfied.
Since then I've been working odd jobs.
And today I've decided to stretch out a bit, and build a basic airtable clone, because I think I can.
And also because I hate anything without an offline option.
First thing I realized was I wasn't about to duplicate all the features of a spreadsheet from scratch. I'd need a base to work from.
I spent about an hour looking.
Core features needed would be trivial serialization or saving/loading.
Proper event support for when a cell, row, or column changed, or was selected. Necessary for triggering validation and serialization/saving.
Custom column types.
Embedding html in cells.
Reorderable columns
Optional but nice to have:
Changeable column width and row height.
Drag and drop on rows and columns.
Right click menu support out of the box.
After that hour I had a few I wanted to test.
And started looking at frameworks to support the SPA aspects.
Both mithril and riot have minimal router support. But theres also a ton of other leightweight frameworks and libraries worthy of prototyping in, solid, marko, svelte, etc.
I didn't want to futz with lots of overhead, babeling/gulping/grunting/webpacking or any complex configuration-over-convention.
Didn't care for dom vs shadow dom. Its a prototype not a startup.
And I didn't care to do it the "right way". Learning curve here was antithesis to experimenting. I was trying to get away from plugin, configuration-over-convention, astronaut architecture, monolithic frameworks, the works.
Could I import the library without five dozen dependancies and learning four different tools before getting to hello world?
"But if you know IJK then its quick to get started!", except I don't, so it won't. I didn't want that.
Could I get cheap component-oriented designs?
Was I managing complex state embedded in a monolith that took over the entire layout and conventions of my code, like the world balanced on the back of a turtle?
Did it obscure the dom and state, and the standard way of doing things or *compliment* those?
As for validation, theres a number of vanilla libraries, one of which treats validation similar to unit testing, which seems kinda novel.
For presentation and backend I could do NW.JS, which would remove some of the complications, by putting everything in one script. Or if I wanted to make it a web backend, and avoid writing it in something that ran like a potato strapped to a nuclear rocket (visual studio), I could skip TS and go with python and quart, an async variation of flask.
This has the advantage that using something thats *not* JS, namely python, for interacting with a proper database, and would allow self-hosting or putting it online so people can share data and access in real time with others.
And because I'm horrible, and do things the wrong way for convenience, I could use tailwind.
Because it pisses people off.
How easy (or hard) would it be to recreate a basic functional clone of the core of airtable?
I don't know, but I have feeling I'm going to find out!1 -
For the whole january month, i was looking to create a text editor in which text is edited in the div block so i thought of doing it with javascript creating events of when this button is pressed do this. then today i found out i can do that with just adding contenteditable='true' in the div element. I was like i should have searched it in the first place.A Month wasted.2