I put an Easter egg into a product, that if you enter the string "final countdown" into the stock code search field, it plays a YouTube vid of Europe's "The Final Countdown", in a hidden div. It's an in-joke for a few people in the company.

A well meaning maintainer with no sense of humour or judgement takes over and goes on the warpath against any hardcoded strings. The secret code gets moved into a config file.

A third developer changes the deployment script so that it clears any configs that aren't explicitly set in the deployment settings.

So the secret code is now "".

Literally every PC in the stock buying department is now blaring out "The Final Countdown" at top volume.

...Except none of them have speakers, so it remains this way for over a year and two more changes of maintainer.

I just noticed this afternoon and quietly re-hardcoded the string. The buying dept.'s PCs will silently sing no more.

Me: I’ve been in the web since 2006, of course i know html,css,javascript.
Also me: Google how to center a div.

z-index so high this div will end up on my upstairs neighbor's phone

Properly align a div before you leave teenage.

Loving the class name for this div on South West Trains 404 page.

Sometimes I feel frontend development is like ancient magic:

Backend Dev: Oh no, I can't align this DIV properly.
FE Dev: No worries!
* Casts Flexius Boxius on the DIV *
* Div aligns slightly better *
BE Dev: But it's not centered!
FE Dev: No worries!
* Casts Marginis Automaticus! *
* Rolls natural 1 *
* Everything collapses *
* Website is on fire *
* Product owner cries *
FE Dev: No worries!
* Casts Flexius Boxius level 5 on the parent div *
* Everything looks beautiful *
* People are in awe *
FE Dev: You are welcome!
* Adjusts his robe and leaves *

Another rant about my gf

She tried HTML and well, cause there are h1, h2, h3... instead of classes, she used div, div2...

Time spent on Web Development :

1% : {
actual productive content and features
}

99% : {
Please. All I want is for this div to vertically align in this other one. Is that too much to ask?
}

I just hate when stuff like this happens...

Found this in an html email.

Just... WHY. Why would someone ever need to do this?

Hey frontend developers. If you do THIS:

z-index: 1000;

...expecting that it will ensure your div will be on top no matter what, I'm about to fuck your world up. Check this shit out:

z-index: 1001;

Callback hell?

Think about div hell

"Who the heck is the parent of this child?" -
I ask to myself when a button doesn't position itself relative to its container div as expected..

:/

In the end, it looks as it's supposed to, but the way it's done is just bad

I AM MISSING A FUCKING DIV TAG OR SOMETHING LIKE THAT AND I CANNOT FIND IT. MOTHERFUCKER FUCKING FUCK.

Why so accurate...

Fuck the memes.

Fuck the framework battles.

Fuck the language battles.

Fuck the titles.

Anybody who has been in this field long enough knows that it doesn't matter if your linus fucking torvalds, there is no human who has lived or ever will live that simultaneously understands, knows, and remembers how to implement, in multiple languages, the following:

- jest mocks for complex React components (partial mocks, full mocks, no mocks at all!)
- token cancellation for asynchronous Tasks in C#
- fullstack CRUD, REST, and websocket communication (throw in gRPC for bonus points)
- database query optimization, seeding, and design
- nginx routing, https redirection
- build automation with full test coverage and environment consideration
- docker container versioning, restoration, and cleanup
- internationalization on both the front AND backends
- secret storage, security audits
- package management, maintenence, and deprecation reviews
- integrating with dozens of APIs
- fucking how to center a div

and that's a _comically_ incomplete list; barely scratches the surface of the full range of what a dev can encounter in a given day of writing software

have many of us probably done one or even all of these at different times? surely.

but does that mean we are supposed to draw that up at a moment's notice some cookie-cutter solution like a fucking robot and spit out an answer on a fax sheet?

recruiters, if you read this site (perhaps only the good ones do anyway so its wasted oxygen), just know that whoever you hire its literally the luck of the draw of how well they perform during the interview. sure, perhaps some perform better, but you can never know how good someone is until they literally start working at your org, so... have fun with that.

Oh and I almost forgot, again for you recruiters, on top of that list which you probably won't ever understand for the entirety of your lives, you can also add writing documentation, backup scripts, and orchestrating / administrating fucking JIRA or actually any somewhat technical dashboard like a CMS or website, because once again, the devs are the only truly competent ones - and i don't even mean in a technical sense, i mean in a HUMAN sense of GETTING SHIT DONE IN GENERAL.

There's literally 2 types of people in the world: those who sit around drawing flow charts and talking on the phone all day, and those WHO LITERALLY FUCKING BUILD THE WORLD

why don't i just run the whole fucking company at this point? you guys are "celebrating" that you made literally $5 dollars from a single customer and i'm just sitting here coding 12 hours a day like all is fine and well

i'm so ANGRY its always the same no matter where i go, non-technical people have just no clue, even when you implore them how long things take, they just nod and smile and say "we'll do it the MVP way". sure, fine, you can do that like 2 or 3 times, but not for 6 fucking months until you have a stack of "MVPs" that come toppling down like the garbage they are.

How do expect to keep the "momentum" of your customers and sales (I hope you can hear the hatred of each of these market words as I type them) if the entire system is glued together with ducktape because YOU wanted to expedite the feature by doing it the EASY way instead of the RIGHT way. god, just forget it, nobody is going to listen anyway, its like the 5th time a row in my life

we NEED tests!
we NEED to know our code coverage!
we NEED to design our system to handle large amounts of traffic!
we NEED detailed logging!
we NEED to start building an exception database!

BILBO BAGGINS! I'm not trying to hurt you! I'm trying to help you!

Don't really know what this rant was, I'm just raging and all over the place at the universe. I'm going to bed.

rant? rant!

I work for a company that develops a variety of software solutions for companies of varying sizes. The company has three people in charge, and small teams that each worked on a certain project. 9 months ago I joined the company as a junior developer, and coincidentally, we also started working on our biggest project so far - an online platform for buying groceries from a variety of vendors/merchants and having them be delivered to your doorstep on the same day (hadn't been done to this scale in Estonia yet). One of the people from management joined the team working on that. The company that ordered this is coincidentally being run by one of the richest men in Estonia. The platform included both the actual website for customers to use, a logistics system for routing between the merchants, the warehouse, and the customers, as well as a bunch of mobile apps for the couriers, warehouse personnel, etc. It was built on Node.js with Hapi (for the backend stuff), Angular 2 (for all the UIs, including the apps which are run through a WebView wrapper), and PostgreSQL (for the database). The deadline for the MVP we (read: the management) gave them, but we finished it in about 7 months in a team of five.

The hours were insane, from 10 AM to 10 PM if lucky. When we weren't lucky (which was half of the time, if not more), we had to work until anywhere from 12 PM to 3 AM, sometimes even the whole night. The weekends weren't any better, for the majority of the time we had to put in even more extra hours on the weekends. Luckily, we were paid extra for them, but the salary was no way near fair (the majority of the team earned about 1000€/mo after taxes in a country where junior developers usually earn 1500€/month). Also because of the short deadline given to us, we skipped all the important parts like writing tests, doing CI, code reviews, feature branching/PR's, etc. I tried pushing the team and the management to at least write tests and make feature branches/PRs, but the management always told me that there wasn't enough time to coordinate and work on all that, that we'll do that after launching the MVP, etc. We basically just wrote features, tested them by hand, and pushed into the "test" branch which would later get tested and merged into master.

During development, one of the other juniors managed to write the worst kind of Angular code you could imagine - enormous amounts of duplication, no reusable components (every view contained the everything used in the view, so popups and other parts that should logically be reusable were in every view separately), fuck - even the HTML was broken (the most memorable for me were the "table > tr > div > td" ones, but that's barely scratching the surface). He left a few months into the project, and we had to build upon his shit, ever so slightly trying to fix the shit he produced. This could have definitely been avoided if we did code reviews.

A month after launching the MVP for internal testing, the guy working on the logistics system had burned out and left the company (he's earning more than twice the salary he got here, happy for him, he is a great coder and an even better team player). This could have been avoided if this project had been planned better, but I can't really blame them, since it was the first project they had at this scale (even though they had given longer deadlines for projects way smaller than this).

After we finished and launched the MVP, the second guy from management joined, because he saw we needed extra help. Again I tried to push us into investing the time to write tests for the system (because at this point we had created an unstable cluster fuck of a codebase), but again to no avail. The same "no time, just test it manually for now, we'll do that later when we have time" bullshit from management.

Now, a few weeks ago, the third guy from management joined. He saw what a disaster our whole project was. Him joining was simply a blessing from the skies. He started off by writing migrations using sequelize. I talked to him about writing tests and everything, and he actually listened. He told me that I'm gonna be the one writing them, and also talked to the rest of management about it. I was overjoyed. I could actually hear the bitterness in the voices of the rest of management when they told me how to write the tests, what to test, etc. But I didn't give a flying rat's ass, I was hapi.

I was told to start off by writing a smoke test for the whole client flow using Puppeteer. I got even happier, since I was finally able to again learn new things (this stopped at about 4 or 5 months into the project).

I'm using jest as the framework and started writing the tests in TypeScript. Later I found a library called jest-extended, but it didn't have type defs, so I decided to write them and, for the first time in my life, contribute to the open source community.

After 3-4 FUCKING hours I finally found a bootstrap thingy which properly centers a div!

In my defense, this shit is all Chinese to me so it's copy-paste-lets-hope-this-works 😅

When I was at my lowest, my buddy and me sat in front of the screen, and learned how to code from Bucky Roberts. A few years later, I finally got a proper programming gig, but never stopped freelancing. My buddy on the other hand, studied Computer Science and stopped coding for a while after graduating. 5 years later, today we sat in front of the screen and learned how to code together again. I think he has no idea what he has led me to. If he had not made me code, I would have remained the same boy from the streets. But it is not about me, I have heard so many incredible stories. The more codes you write, the more errors you'll encounter. The more errors you try to solve, the bigger the community grows. It's nice to know, there is a group of people out there, who will spend rest of their lives writing, thinking and interacting. Also, trying to figure out how to centre that piece of shit of a div with CSS! I mean wtf!

You know you're tired when you try to open a div like "div()"

I need sleep.....

No matter how many times I learn how to center a text vertically in a div, every time I have to spend half an hour just looking for a solution

I used to have this habit of developing with questionable placeholder content.

console.log("boobs").

<div>why the fuck am I still waiting for your fucking content, dave</div>.

<img src="drunk_boss_dancing_at_xmas_party. jpg"/>

One slips through, eventually.

Now it's all boring lorem ipsums and stock photos of smiling managers shaking hands...

I was a little too harsh on a colleague today.

He asked to help him get something working... After looking at it for a bit, I asked: "I don't get it, what have you been doing all day? Yesterday we split this element into two separate divs, and it worked perfectly, now I've see you've moved all the styles back to the container and there's only one div. The easiest way to get this to work properly is to simply undo everything you've done today."

He looked at me with puppy eyes and I realized I was too harsh. He wasn't _trying_ to break everything, he just hadn't understood why we split the element into two divs. So I lowered my tone a bit, and explained everything again, from the start, then did it again together with him and made sure he understood the separation.

But I still feel bad for how I talked to him. It's not like I shouted or cursed or anything (and I curse a _lot_ when talking about code). It was just condescending as fuck, and belittling. As if I was mocking him for not being as experienced as I am.

I'll do better next time.

Everyone when writing HTML:

<header></header>
<section>
<ul>
<li></li>
</ul>
</section>
<footer></footer>

ME:

<div><div></div></div>
<div><div><span><div></div></span></div></div>
<div><div></div></div>

Me: hello IE, you see that div with id?
IE: ...... ..... .... yes.
Me: would you like to set it as absolute and stick to bottom?
IE: ........... i don't know...
Me: but all the other guys like chrome and firefox are doing it.. come on it's not object-fit: cover; just absolute positioning. Please.
IE: ......... I can't!
Me: why the fuck not??
IE: ......because I don't see the id...
Me: FUCK YOU YOU FUCKING PIECE OF FUCKING SHIT!!!!!
IE:...............

FUCK CSS!

I spend more time positioning a single button than learning a frickin framework!

I gave up trying to make a div the same height as its parent. No clue why height:100%; doesn't work!

"I'm going to manage to make this webpage without so many divs"

"Oh. I need a div there"

"There too"

"Yes, and there ofc."

*looks back at markup*

*sobs*

Ok, people who invented CSS... which seems more intuitive and easier to read?

div {
margin-right: auto;
margin-left: auto;
}

Or

div {
center-this-damn-div: true;
}

I was tasked with maintaining a handful of chemistry simulations for the web. First things first, replace these outdated links and turn them into Bootstrap buttons that work on mobile. Wait, why do all of these look so horrible on mobile? nothing's scaling properly. *looks at fucking 1,000-line CSS file* The old developers used position:absolute for absolutely EVERYTHING. And I counted one div on the entire page. This is why you don't trust chem engineers to do your "web design" #FuckDreamweaver

Interviewer: Hello my name is Alyssa from Sheeple and my pronouns are she/her

Dev: Oh yeah I saw that in your email

Interviewer: Ok well I am just letting you know they are still the same

Dev: Thanks for that.

Interviewer: What are your pronouns?

Dev: div/span

Interviewer: Sorry?

Dev: he/him

Interviewer: Oh…ok. Let me know if that changes.

Dev: I promise you it won’t

Interviewer: Well you never know!

Dev: …

Oke so this just happened...

Spent 30 minutes figuring out why the f**k a div was vertically centered within another one.

Apparently margin:auto within a display: flex not only centers horizontally but also vertically.

I remember the days when i spent hours vertically centering sh*t. What universe are we in?

I'm editing the sidebar on one of our websites, and shuffling some entries. It involves moving some entries in/out of a dropdown and contextual sidebars, in/out of submenus, etc. It sounds a little tedious but overall pretty trivial, right?

This is day three.
I learned React+Redux from scratch (and rebuilt the latter for fun) in twice that long.

In my defense, I've been working on other tasks (see: Alerts), but mostly because I'd rather gouge my freaking eyes out than continue on this one.

Everything that could be wrong about this is. Everything that could be over-engineered is. Everything that could be written worse... can't, actually; it's awful.

Major grievances:
1) The sidebars (yes, there are several) are spread across a ridiculous number of folders. I stopped counting at 20.
2) Instead of icon fonts, this uses multiple images for entry states.
3) The image filenames don't match the menu entry names. at all. ("sb_gifts.png" -> orders); active filenames are e.g. "sb_giftsactive.png"
4) The actions don't match the menu entry names.
5) Menu state is handled within the root application controller, and doesn't use bools, but strings. (and these state flags never seem to get reset anywhere...)
6) These strings are used to construct the image filenames within the sidebar views/partials.
7) Sometimes access restrictions (employee, manager, etc.) are around the individual menu entries, sometimes they're around a partial include, meaning it's extremely difficult to determine which menu entries/sections/subsections are permission-locked without digging through everything.
8) Within different conditionals there are duplicate blocks markup, with duplicate includes, that end up render different partials/markup due to different state.
9) There are parent tags outside of includes, such as `<ul>#{render 'horrific-eye-stabbing'}</ul>`
10) The markup differs per location: sometimes it's a huge blob of non-semantic filthiness, sometimes it's a simple div+span. Example filth: section->p->a->(img,span) ... per menu entry.
11) In some places, the markup is broken, e.g. `<li><u>...</li></u>`
12) In other places, markup is used for layout adjustments, such as an single &nbsp; nested within several divs adorned with lots of styles/classes.
13) Per-device layouts are handled, not within separate views, but by conditionally enabling/disabling swaths of markup, e.g. (if is_cordova_session?).
14) `is_cordova_session` in particular is stored within a cookie that does not expire, and within your user session. disabling it is annoying and very non-obvious. It can get set whether or not you're using cordova.
15) There are virtually no stylesheets; almost everything is inline (but of course not actually everything), which makes for fun layout debugging.
16) Some of the markup (with inline styling, no less) is generated within a goddamn controller.
17) The markup does use css classes, but it's predominately not for actual styling: they're used to pick out elements within unit tests. An example class name: "hide-for-medium-down"; and no, I can't figure out what it means, even when looking at the tests that use it. There are no styles attached to that particular class.
18) The tests have not been updated for three years, and that last update was an rspec version bump.
19) Mixed tabs and spaces, with mixed indentation level (given spaces, it's sometimes 2, 4, 4, 5, or 6, and sometimes one of those levels consistently, plus an extra space thereafter.)
20) Intentional assignment within conditionals (`if var=possibly_nil_return_value()`)
21) hardcoded (and occasionally incorrect) values/urls.

... and last but not least:
22) Adding a new "menu sections unit" (I still haven't determined what the crap that means) requires changing two constants and writing a goddamn database migration.

I'm not even including minor annoyances like non-enclosed ternaries, poor naming conventions, commented out code, highly inefficient code, a 512-character regex (at least it's even, right?), etc.

just.

what the _fuck_

Who knew a sidebar could be so utterly convoluted?

Me: why are you using so many break tags?

Intern: Its the only way I can position this div below that form.

Me: *facepalm*

Center this div VERTICALLY......

The idea was simple. Create a div.
Add two 50% div's inside. Float them. Add clearfix to parent.

Everything was fine.

Noticed that one of the childs had a height bigger than the other. But due to an adaptive design, setting static heights did not work.

Simple fix. Add a height to parent div and set overflow-y to hidden.

It didn't work.

Tried using the legendary !Important (a.k.a. not important but important.) Didn't work. Set position to relative, set static height. Set the childs to absolute position with height 100%. Problem solved.

No. It. Didn't. Fucking. Work.

Tried every possible css combination could could fucking think off.

After 15 minutes (8 hours in dev-stress mode) realized the clearfix changed the div DISPLAY TO FUCKING TABLE. A TABLE. FUCKING TABLES CANT HAVE FUCKING HEIGHTS FUCK.

Anyway. 6 years after my first clearfix. I learnt something new about the code that saves my life every project.

Today I:

Me: "You wrapped 2 p tags and one div inside a button tag....why?"

Other dude: "What do you mean why?" * in condescending tone

Aaaaaaaaaaaand

I lost my shit.

To make things short. My manager told me I have to try harder to not speak to people in intimidating ways.
In all fairness...mr "associates in programming with 0 css experience" WAS condescending when I asked him why he did what he did.

The little shit earned it. And he will probably think twice about his damned tone when speaking to me.

Here's what I saw today
To add space between two rows of images.

<div>
//A row of images
</div>

<h1 style="color:white">a</h1>
<div>
//A row of images
</div>

-Dev support group-

Me: Hello, my name is div.
Other Devs: Hello, div.
Me: Its been 3 days since I last coded...
Other Devs: 😲

Honestly just looking at HTML...
<div> nested in <div> tested in 10 more <div>'s.

Me every time I have to adjust the css:

*center that div*
*hit refresh*
Fuck, now that button is over there.
*adjust the padding and kajigger with the margin a little*
*hit refresh*
Ah, I'm an idiot. I forgot to set the display to inline-block.
*adjust the display*
*hit refresh*
WHY THE FUCK IS THE BACKGROUND RED NOW??!?!?!?

Thinking about this makes me pull my fucking hairs.

The fact that I have to look for the actual content in a website, among all the ads, prompts and fucking stupid design is fucking ridiculous.

Every fucking website is following this designs now. Always showing popups to subscribe to their fucking newsletter the moments you visit the site.

Can you please let me fucking read the content I require first?

"No fucking way. I will block 80% of the viewport with unnecessary stuff. I will place my ads on the left and right side. On the bottom, I will have a blocking div that will prompt you to subscribe to our newsletter. And on the top, we will have this huge fucking navbar which will take 30% of the view. That 20% area left in the middle? yeah, good luck on finding something useful in there"

Then there are this fucking cunts, that blocks the whole website the moment you enter.

"Oh, you need some information, right? Why not just subscribe to our emails first so that we can send your useless junks every now and then".

Oh my fucking batman, don't even remind me of those stupidass videos. Now 90% of the popular website will play a video immediately after you enter the website.

And guess what?! The volume will be amplified to 500% so that that's the sound you will ever hear in your lifetime.

The fucking web is becoming absolute shite right now. We really need a revolution here which makes the websites show the appropriate amount of ads and prevents them from doing all these stupids shits.

full stack web development in 2017: mvvm model, api for backend, parsing on frontend

me: <?php echo "<div>hello".$name."</div>" ?>

Yesterday a colleague of mine told me that another colleague has done this in his web application for a subject:

For checking user and password, he did not query a database, but instead he checked information in a HIDDEN DIV in the html page.

Reason: "this way I don't lose my precious time".

I think of that and I'd like to punch him. People like him are the reason websites in Italy suck and my University web infrastructure sucks (he worked as intern on that).

My. God.

!rant

A wild "Using this website in incognito mode requires a paid subscription" blocking div appears

Normal people: okay... *proceeds to exit incognito mode*

Developers: huh.. Bitch please.. *inspect element, hide blocking div. Select html tag, remove "overflow: hidden". Profit*

Why would anyone want to block surfing incognito anyway? They should be encouraging it actually..

PS:, While writing this, wondering if content for subscribed users is also locked this way.. Now that would be hilarious.

<div id="!rant">
Finally have a full time job lined up for when I graduate in a month!
</div>

I'm internally moved from envy feelings against the very first users of StackOverflow.
The ones that got tens of thousands of upvotes for questions like "how to set the width of a div element?"

Why does CSS never work the way you'd expect? All I want to do is align something to the bottom of a div. No. Will not happen. You'd think it might be something simple as 'v-align' or 'align: bottom' or 'fucking put it at the bottom: now;'

No, it's never that simple. I try every result I can find from googling. Nothing. Simply does not work.

How about trying to keep a div to a square when you resize the page? That should be simple? height = width right? Fuck you. Ha hahah, no you have to implement some horrendous arcane hack involving fake elements and other bullshit.

You finally fix one thing and everything else you had working is now broken.

...and then some fuckwit comes along and goes "Oh, CSS isn't hard..." and it takes everything you have not to beat them to death with your rubber duck.

What the hell is wrong with CSS? It's not even programming! It's just pure, sadistic hell! FUCK CSS!!!!

It's 2017.

Why is vertically centering a div still so stinkin hard?

Yeah yeah ik what you will tell me, "use flexbox".
Well guess what,. I HAVE BEEN TRYING TO FOR THE PAST 6 FUCKING HOURS!

I've gone as far as to copy code from 20+ different websites advertising working solutions. My tab bar looks like the fucking rockey mountains!

My main problem is that flexbox on chrome is not accepting ANY % values.

Now if you'll excuse me, I need to go kill myself. YAY! 🤗

!$rant

Operation slanted div is a success! :D

One of questions in short test that we give to interviewed frontend devs is:

"How would you center a <div> horizontally with CSS?"

So many still answer with <center> ...

git commit -m "fixed bug where div wasn't resizing with window size change. Next I'll work on new bug which makes it so the pages won't load at all"

Spend quite a while at work trying to get two divs inside a centered div next to each other and especially get them the same height as the parent div.

Got it working after numerous tries, was going to take the code home to continue.

Forgot to take the code home, have to start over again and I hardly understand CSS 😥

Fuck me. (Writing a new service thingy by the way)

Oldschool CSS was not much fun, but I never understood how this made it any better:

<div><div><div><div><div><div>Bootstrap</div></div></div></div></div></div>

I always forgot a row, had cols inside of cols, forgot how form-groups worked, or found other ways of messing up the whole layout.

Instead of complex CSS, there was now this new complex language entirely expressed through the nesting of layers upon layers of divs. It was like LISP's brackets, but more verbose.

That was the moment I realized that fullstack is bullshit, that there are intrinsic talent differences between frontend and backend devs, and that it's OK to focus on a narrower but deeper field.

I just found this bit of code in our product :P

setInterval(function () {
$("body").find("div, td").replaceText("oldProductName", "newProductName" );
}, 50);

A healthy div lives in a healthy body

For those of you tired of boring old div soup, one of my classmates has some new and innovative span soup for you to try!

I am much too tired to go into details, probably because I left the office at 11:15pm, but I finally finished a feature. It doesn't even sound like a particularly large or complicated feature. It sounds like a simple, 1-2 day feature until you look at it closely.

It took me an entire fucking week. and all the while I was coaching a junior dev who had just picked up Rails and was building something very similar.

It's the model, controller, and UI for creating a parent object along with 0-n child objects, with default children suggestions, a fancy ui including the ability to dynamically add/remove children via buttons. and have the entire happy family save nicely and atomically on the backend. Plus a detailed-but-simple listing for non-technicals including some absolutely nontrivial css acrobatics.

After getting about 90% of everything built and working and beautiful, I learned that Rails does quite a bit of this for you, through `accepts_nested_params_for :collection`. But that requires very specific form input namespacing, and building that out correctly is flipping difficult. It's not like I could find good examples anywhere, either. I looked for hours. I finally found a rails tutorial vide linked from a comment on a SO answer from five years ago, and mashed its oversimplified and dated examples with the newer documentation, and worked around the issues that of course arose from that disasterous paring.

like.
I needed to store a template of the child object markup somewhere, yeah? The video had me trying to store all of the markup in a `data-fields=" "` attrib. wth? I tried storing it as a string and injecting it into javascript, but that didn't work either. parsing errors! yay! good job, you two.

So I ended up storing the markup (rendered from a rails partial) in an html comment of all things, and pulling the markup out of the comment and gsubbing its IDs on document load. This has the annoying effect of preventing me from using html comments in that partial (not that i really use them anyway, but.)

Just.
Every step of the way on building this was another mountain climb.
* singular vs plural naming and routing, and named routes. and dealing with issues arising from existing incorrect pluralization.
* reverse polymorphic relation (child -> x parent)
* The testing suite is incompatible with the new rails6. There is no fix. None. I checked. Nope. Not happening.
* Rails6 randomly and constantly crashes and/or caches random things (including arbitrary code changes) in development mode (and only development mode) when working with multiple databases.
* nested form builders
* styling a fucking checkbox
* Making that checkbox (rather, its label and container div) into a sexy animated slider
* passing data and locals to and between partials
* misleading documentation
* building the partials to be self-contained and reusable
* coercing form builders into namespacing nested html inputs the way Rails expects
* input namespacing redux, now with nested form builders too!
* Figuring out how to generate markup for an empty child when I'm no longer rendering the children myself
* Figuring out where the fuck to put the blank child template markup so it's accessible, has the right namespacing, and is not submitted with everything else
* Figuring out how the fuck to read an html comment with JS
* nested strong params
* nested strong params
* nested fucking strong params
* caching parsed children's data on parent when the whole thing is bloody atomic.
* Converting datetimes from/to milliseconds on save/load
* CSS and bootstrap collisions
* CSS and bootstrap stupidity
* Reinventing the entire multi-child / nested params / atomic creating/updating/deleting feature on my own before discovering Rails can do that for you.

Just.
I am so glad it's working.
I don't even feel relieved. I just feel exhausted.

But it's done.
finally.

and it's done well. It's all self-contained and reusable, it's easy to read, has separate styling and reusable partials, etc. It's a two line copy/paste drop-in for any other model that needs it. Two lines and it just works, and even tells you if you screwed up.

I'm incredibly proud of everything that went into this.
But mostly I'm just incredibly tired.

Time for some well-deserved sleep.

Should I take a break?

as always ...

I see too many back-end rants against front-ends.

Should we talk about table layouts, malformed html, programatically generated spaghetti wrong markup, css absurd class naming, infinite div wrapping (div-itis), awful usability, poor legibility, terrible typography, wrong color palettes and user-unfriedly design? To name a few horrors i've seen so far.

Some people won't admit that their contempt against HTML and CSS being 'not real code' actually hides their inability or unwillingness to learn it. Or they need the feeling of superiority.

Spent an entire day trying to fix a major bug that made the entire application fall over... It was an unclosed div tag. Literally one missing / can cause so much pain!

GoodGuy BroCow
Senoir problem
2years back

Senoir dev was assigned to make a webapp for billing

Dude uses dreamviewer and writes code like a bitch

Phpmysqljqueryhtml whole thing mixed very badly and undocumented

His function name format fun_1()

a simple update cost him a day,

Told him to use brackets atleast and also a framework ,guy denies

Days go by

He learns a lot of stuffs from me ,like how to use inspect in chrome lol, how to use sqlite for small projects , and orm and frameworks.

He used to pin his mistakes on me, so that boss gets angry on me

Then i quit the job

2 years went by

Now he is unemployed, nobody wants a 24 year old plain php coder and template editing web developer

Anyway I hired him, he was my first senior, whatever he did,it didnt matter to me, bcoz i remember

the days we spent on the same hall right next to each other coding in php,

days we brainstormed to fix a div

Also the days we ate lunch and breakfast together

Semantic HTML conveys...

Why the hell does every single frontend job on Earth require expert knowledge of React, a fad JS library that will be forgotten in 5 years?

For extra credit: when was the sage advice of "keep content, appearance, and behavior separate" overruled in favor of "use JavaScript for literally everything"? Have I been in a coma for the past 3 years?

Look, I understand the appeal of separating code into repeatable components. I just don't understand why essentially the same thing can't be accomplished with vanilla JS, which is ten times easier to understand and doesn't require an entire website to be written in some make-believe offshoot of Ecmascript that will look like hieroglyphics a decade from now.

There are also seemingly no positions that offer people a platform to start applying React to real world scenarios. I've seen the "understand React in 5 minutes" articles. Wow, super cool, you used 30 lines of JavaScript to render a "Hello world" div. The possibilities are truly endless.

But seriously, how does this shit work? Where do I go to learn the mystical art of offloading every single one of a website's responsibilities to JavaScript? How do I use React to build an actual functioning website, and at what point will it save me time or increase my productivity instead of just pissing me off?

Am I the only one that gets fucking pissed when others write unnecessary <div>s?

I know sometimes it's necessary for styling, but my coworkers do it because it's easier to add a new div than extending the style of an existing element.

What's worst, when I do it they reject my PR saying to create a new div instead. Fucking fuck off.

I am not a front end developer. Don't have the skill set, but I am learning. Work assigns me an "easy" task of modifying someone else's angular code(with all those <div> tags) to change some functionality. If it was well formatted, easy shit.

WHY THE FUCK DID THE PREVIOUS FUCKER INDENT LIKE THEY HATE ME? PARENT TAGS ARE FARTHER OUT THAN CHILDREN TAGS. SOME OF THE TAGS ARE 10 TABS FROM THE LEFT, WHILE THEIR CHILD IS ONLY 2. IN ADDITION, ALL THEIR CODE IS COPY PASTED FROM OTHER FILES, REFERENCES CONTROLLERS FROM OTHER PARTS OF THE CODE IT DOESNT NEED!

I am tempted to kill it with fire, find the person who wrote it(on a different continent), kill them, and then rewrite the whole thing in a language I am still learning. FUCK!

<div><div><div><div><div><div><div><div></div></div></div></div></div></div></div></div>

CSS - Separate style from content...
Yeah... More like creating divs to make that fucking div aligned.

Straight from table hell to div hell

When someone makes fun of UI development, and you challenge him to vertically center align a div. Challenge accepted and lost :D

Dev’s then: “Let’s make a new software that will revolutionize the world!!!”.

Dev’s now: “How do I center a div in CSS?”.

Sweet mother of unlogical fucking gods.

How does this even make sense
😩🔫

<aura:if isTrue=“{!not(empty(v.errorMessage))}”>
<div>{!v.errorMessage}</div>
</aura:if>

Ps: the ! Does not mean “not” 🤪

So recently I did a lot of research into the internals of Computers and CPUs.
And i'd like to share a result of mine.

First of all, take some time to look at the code down below. You see two assembler codes and two command lines.

The Assembler code is designed to test how the instructions "enter" and "leave" compare to manually doing what they are shortened to.

Enter and leave create a new Stackframe: this means, that they create a new temporary stack. The stack is where local variables are put to by the compiler. On the right side, you can see how I create my own stack by using

push rbp
mov rbp, rsp
sub rsp, 0

(I won't get into details behind why that works).

Okay. Why is this even relevant?
Well: there is the assumption that enter and leave are very slow. This is due to raw numbers:
In some paper I saw ( I couldn't find the link, i'm sorry), enter was said to use up 12 CPU cycles, while the manual stacking would require 3 (push + mov + sub => 1 + 1 + 1).

When I compile an empty function, I get pretty much what you'd expect just from the raw numbers of CPU cycles.

HOWEVER, then I add the dummy code in the middle:

mov eax, 123
add eax, 123543
mov ebx, 234
div ebx

and magically - both sides have the same result.

Why????

For one thing, there is CPU prefetching. This is the CPU loading in ram before its done executing the current instruction (this is how anti-debugger code works, btw. Might make another rant on that). Then there is the fact that the CPU usually starts work on the next instruction while the current instruction is processing IFF the register currently involved isnt involved in the next instruction (that would cause a lot of synchronisation problems). Now notice, that the CPU can't do any of that when manually entering and leaving. It can only start doing the mov eax, 1234 while performing the sub rsp, 0.

----------------

NOW: notice that the code on the right didn't take any precautions like making sure that the stack is big enough. If you sub too much stack at once, the stack will be exhausted, thats what we call a stack overflow. enter implements checks for that, and emits an interrupt if there is a SO (take this with a grain of salt, I couldn't find a resource backing this up). There are another type of checks I don't fully get (stack level checks) so I'd rather not make a fool of myself by writing about them.

Because of all those reasons I think that compilers should start using enter and leave again.

========

This post showed very well that bare numbers can often mislead.

Followed lectures from Udemy, build a burger 🍔 with div again!
The entire course build burger multiple times with 400+ videos... 🤦‍♂️
Is it really a thing? No matter what frontend framework you pick, you got build a burger with it 🤤

My first line of code today 🙈⚠️

```
<div class="corona-banner"></div>
```

human : Merry Christmas :)
js : console.log("Merry Christmas")
python 2 : print "Merry Christmas"
python 3 : print ("Merry Christmas")
bash : echo "Merry Christmas"
c++ : printf("Merry Christmas")
java : System.out.println("Merry Christmas")
html : <div> Merry Christmas </div>

add in for your favorite languages...

You spend 2 hours debugging why content not showing up and end up seeing whole div class being
display: none;

Nested .container divs for days.

Making a small update to an ionic app then spending a whole day trying to figure out why a button doesn't work. Tried everything to fix it and got no error messages.

Finally discovered it was because the button was inside a label and not a div.

Yeah, fun times.

Is it just me or what. I had begun learning web development (but prefer C, shell scripting, Linux... ).

One thing that amazes me - besides having to learn 1356367626785576 technologies to get something done and the fact we get a fresh new amazing framework every 0.00000000000234 seconds - is CSS.

Amazing, I made a navigation bar where I wanted the items to be displayed in the horizontal position, so I
.navbar li, a {display:inline-block}

Works fine.

Next day I'm doing the same from scratch, doesn't fucking work. I look the previous design, HTML structure looks identical, I only use a different font face and colors.

After a while I randomly decided to put a <div> around the a element in order to do something else, update the page and... Voilá, text is in line.

Like... Wtf.

I'm like fuck it. No way I want to work with this shit, let's go back to shell.

You think HTML isn't a programming language? Tell that to the guy wrote js to check if a hidden div contained the word True inside its tag before it fired.

Working with a client on his "superior idea" and suddenly this happens: (longer rant)

tl;dr;
Client wanted me to move a div by 3 millimetres to the left and blamed me for not being capable of doing so while giving him a nonsense about different resolutions and screen sizes. (Use a ruler, DUH)

Me: Here's the updated design layout as our designer specified.
Him: Looks good but it needs to be moved 3 millimetres to the left
Me: *Confused as hell* - Wait, did you just said 3 millimetres?
Him: Yes, is that a problem for you?
Me: *Amazed* Well, yes, you see, we don't measure in millimetres. We use pixels.
Him: Ahh, can't you do anything right!? Why do I have to deal with your nonsense of telling me that this is not impossible? Just take your god damn ruler and put it on your screen, then move it 3 millimetres to the left.
Me: You do realise that every person has a different size/resolution monitor so it won't work?
Him: I don't care. Just do your god damn job or i'll find someone else to do it.
*
Story continued in such manner - we spent an hour on skype moving the stupid <div> around until it hit his 3 millimetres mark.
*
His: See, you could do it.
Me: *Sends him screenshot of my own screen (his was 1024x768, mine 1920x1080) where page is broken and not aligned*
Him: Oh come on, you break every god damn thing. You are the worst. I'm going to find a better one. *hangs skype call*
Him: *3 days later* Hi, so, umm, I've talked to other developers and they said it's impossible to measure in millimetres. Can you revert those changes we did?

After all this I've fully realised that this person is sits at computer very rarely and does not how it even works...

First html file I opened today had a
<div style=‘display:block;’>...

I knew it was going to be a bad day.

When people include the entire jQuery library to animate one single div 😑

Was creating an interactive map through Google Maps API. The map wasn't displaying at all on the website. Spent 2 hours trying to fix. Just realized I've not given height to the map div :-/

How do you get tons of stars on Github in two steps?

1. Make a website for noob devs who cant tell the difference between a div and span.
2. Guide them to sign up on Github and ask them to give your repo a star as part of the process (dont forget visual guides)

Voila!
Now you get shitload of stars from people who dont even know what the fuck github does.

Every Website seem to has some glitches... and you can't ignore them like non-web-devs do... i wish i could look up the menu on a local restaurant-website without going crazy about the buggy slider or the misaligned address-div

The 'i am a total noob' feeling is real fiah like a mix tape right now. last week on a personal project i had the problem of placing a div within a div and the buttons not being clickable. i fixed it by fixing the positions of the elements. today the same thing but will a scrolling div and f*ck me right i just had to forget the solution. now i have been stuck for hours trying to figure out the right way and fooling around with no solution. learn your fundamentals.

<!-- Dear future me: I swear to god, if you play with this, I will claw out your eyeballs and eat them for lunch. You've been warned. -->

</div>

Everyone and their dog is making a game, so why can't I?
1. open world (check)

2. taking inspiration from metro and fallout (check)

3. on a map roughly the size of the u.s. (check)

So I thought what I'd do is pretend to be one of those deaf mutes. While also pretending to be a programmer. Sometimes you make believe
so hard that it comes true apparently.

For the main map I thought I'd automate laying down the base map before hand tweaking it. It's been a bit of a slog. Roughly 1 pixel per mile. (okay, 1973 by 1067). The u.s. is 3.1 million miles, this would work out to 2.1 million miles instead. Eh.

Wrote the script to filter out all the ocean pixels, based on the elevation map, and output the difference. Still had to edit around the shoreline but it sped things up a lot. Just attached the elevation map, because the actual one is an ugly cluster of death magenta to represent the ocean.

Consequence of filtering is, the shoreline is messy and not entirely representative of the u.s.

The preprocessing step also added a lot of in-land 'lakes' that don't exist in some areas, like death valley. Already expected that.

But the plus side is I now have map layers for both elevation and ecology biomes. Aligning them close enough so that the heightmap wasn't displaced, and didn't cut off the shoreline in the ecology layer (at export), was a royal pain, and as super finicky. But thankfully thats done.

Next step is to go through the ecology map, copy each key color, and write down the biome id, courtesy of the 2017 ecoregions project.

From there, I write down the primary landscape features (water, plants, trees, terrain roughness, etc), anything easy to convey.
Main thing I'm interested in is tree types, because those, as tiles, convey a lot more information about the hex terrain than anything else.

Once the biomes are marked, and the tree types are written, the next step is to assign a tile to each tree type, and each density level of mountains (flat, hills, mountains, snowcapped peaks, etc).
The reference ids, colors, and numbers on the map will simplify the process.

After that, I'll write an exporter with python, and dump to csv or another format.

Next steps are laying out the instances in the level editor, that'll act as the tiles in question.
Theres a few naive approaches:

Spawn all the relevant instances at startup, and load the corresponding tiles.

Or setup chunks of instances, enough to cover the camera, and a buffer surrounding the camera. As the camera moves, reconfigure the instances to match the streamed in tile data.

Instances here make sense, because if theres any simulation going on (and I'd like there to be), they can detect in event code, when they are in the invisible buffer around the camera but not yet visible, and be activated by the camera, or deactive themselves after leaving the camera and buffer's area.

The alternative is to let a global controller stream the data in, as a series of tile IDs, corresponding to the various tile sprites, and code global interaction like tile picking into a single event, which seems unwieldy and not at all manageable. I can see it turning into a giant switch case already.

So instances it is.

Actually, if I do 16^2 pixel chunks, it only works out to 124x68 chunks in all. A few thousand, mostly inactive chunks is pretty trivial, and simplifies spawning and serializing/deserializing.

All of this doesn't account for
* putting lakes back in that aren't present

* lots of islands and parts of shores that would typically have bays and parts that jut out, need reworked.

* great lakes need refinement and corrections

* elevation key map too blocky. Need a higher resolution one while reducing color count
This can be solved by introducing some noise into the elevations, varying say, within one standard div.

* mountains will still require refinement to individual state geography. Thats for later on

* shoreline is too smooth, and needs to be less straight-line and less blocky. less corners.

* rivers need added, not just large ones but smaller ones too

* available tree assets need to be matched, as best and fully as possible, to types of trees represented in biome data, so that even if I don't have an exact match, I can still place *something* thats native or looks close enough to what you would expect in a given biome.
Ponderosa pines vs white pines for example.

This also doesn't account for 1. major and minor roads, 2. artificial and natural attractions, 3. other major features people in any given state are familiar with. 4. named places, 5. infrastructure, 6. cities and buildings and towns.

Also I'm pretty sure I cut off part of florida.
Woops, sorry everglades.

Guess I'll just make it a death-zone from nuclear fallout.

Take that gators!

Why do websites have to make their html so fucking hard and complicated to read with something like beautifulsoup. Like I just want to scrape your data. Fuck your embedded iframes and div lists. Why must you do this I JUST WANT YOUR DATA

WHY IS IT SO HARD TO CENTER A DIV

So this i quite a big project, hundreds of files everywhere, pages are rendered using multiple files.

This is one of the latest created page, it was made by my boss, and it just give me the creeps.

I REALLY don't know how he always comes up with shit like these.

I just hate having more than 5 closing tags in sequence...

...
$html .= '</li></ul></div>' . $label . '</div>';

return new JsonModel(
'status' => true,
'html' => $html
);

every time i see someone asking how to center a div, someone jump and says : "use bootstrap" arrr

Just spent three hours debugging why a jquery didn't do some actions with a div through its id. MAYBE NEXT TIME I SHOULD CHECK FOR FUCKING DUPLICATE ID'S AND REMEMBER COPYING SOME CODE THE DAY BEFORE WHICH CONTAINED THAT FUCKING ID. GODVERDEGODVERDOMME.

Story time.

I worked on a project recently where the HTML was written just _perfectly_. Div elements were exactly indented as the blocks on the browser window.

CSS classes were self explanatory and altering them didn't introduce any new kind of bug on the browser window.

Introducing a new div block with CSS classes fit perfectly in the window along with responsiveness on different screens.

JS was also written in a self explanatory way.

It was such an Italian Chef's kiss grade of work that I just sat back and admired the glorious work for 10 mins. Totally deserved it.

I just remembered a weird fix in a bug, some old developer hide the error message using css, placing it in a div then just used display none. LOL

I had to remove the inherited elements of a div element in jQuery so I googled "kill children".

took me a while to understand ...

Coding + 7 pints of lager and a gin martini = an hour shouting at a div and then realising you're missing the dot.

CSS Vertical Alignment:

div {
display:flex;
align-items:center;
}

This is not a problem anymore, so can we stop pretending like it is?

I can't use Javascript object destrucuring in react components because a colleague doesn't like / understand it for some reason.

So instead of:
({ something }) => {
return (
<div>{something}</div>
)
}

If have to use
(props) => {
return (
<div>{props.something}</div>
)
}

Its no big issue, but I hate it.

Q. Why didn't the DIV get invited to the dinner party?

A. Because it had no CLASS!

Since I am running a home server and want to be updated on what the stats are, I did create a webpage where I can get the "renewed" information via ajax (not with jQuery) in every 5 seconds. The thing is that I don't get the "new" information. It's still the old information that keeps reshown in the div.
I checked the server.php file. It keeps getting regenerated. Since, that is the case, it isn't the server to blame. But more likely the client.php is the one that is causing problems. May someone know how to deal with that?

Literally swear I despise flash. So, had a small job to update a page that consisted of a list of members, clicking on a members name will populate an adjacent div with 3 or 4 contact names. Simple stuff on the face of it.

However, it turned out the previous developer had decided to use flash for this, meaning there is a horrible .swf plonked into the page.

I mean seriously, why can't things be simple? :(

I have a meeting today with our UX designer to explain why we can't provide a Photoshop resizing functionality to a block level element inside a content editable div. That will be hard.

Socalled Sr Frontender... doesn’t close div tags. Common dude. You are as junior as they come XD

colleague: how would you center a div horizontally?
me: I wouldn't

Okay, Google. Stop this.

I'm very upset. Drive applications have gotten slower and slower over time on every single browser that isn't chromium based. This isn't their fault. You can't make your application, that tons of institutions pay for, gradually slower on every browser that's not yours. This never used to be a problem, and now it affects everyone *but you*. It's highly suspicious given your track record with YouTube. Hidden div over the video to prevent hardware optimization. What the hell?

You used to be the only big 4 company I had some trust left in. Over the last few months, I've lost it.

When your self-proclaimed "senior frontend web developer with 4 years experience" colleague asks you for the difference between "div .x" and "div.x" in CSS. That is when you understand why so many developers don't like having to work with designers.

Sometimes I come across this:
<div id='myDatePickerForm' ng-show='showDate' ng-hide='!showDate'></div>

I've been given an intern to help me with my work (lol it's not helping) and she knows almost nothing of web dev, not even what Nodejs is, I had to explain it and guide her step by step on how to install it on her laptop. On her CV it says she has JavaScript experience, but she cannot even put together a basic HTML page, she asked me what a div is. As far as I know, HTML, CSS and JS are pieces of the same pie and you cannot really work with JS unless you also work with HTML and CSS. I think she lied on her CV and I need to tell my manager.

My question is, is it normal to know JavaScript and not know much about HTML and CSS?

*adds border to the bottom of a fucking div*

Why, hello there Mr. FUCKTARD HORIZONTAL-FUCKING-SCROLLBAR. That totally makes God damn fucking shittard fuck'ala'fucking fuck-damn'le-shit-fucka-shittard sense.

Today one of my friends asked me how to change a div background color and I sad that it was in the CSS and he told me he didn't has CSS...

ARGH!
Since that privacy cookie policy change thingy, every goddamn site pops up the dialog asking about it.

I just want to fucking read the page, quickly; get off my screeeeeeen!

There should be a standard to add something that lets the browser tell the page if you accept cookies or not, and which options to use; or at least make all the sites use a specific attribute for the elements of the div, so it can be automated (I know this is a dream).

/rant
When you spend longer trying to work out why your background <div> refuses to cover the entire page, than you spent coding an entire user-authentication system in TypeScript for Angular 2.

one of my friend is new to frontend dev.

and he's trying to center a div (text).

using position absolute and relative.

It's not working BTW.

We're communicating over text.
Must be loosing his mind.
He'll finally understand center div memes.

I'm so glad that I got a CS degree learning Data Structures, Algorithms, Operating systems, Databases, Linear Algebra, Software Engineering, Networking and many more...

How else would I have been able to center a div with CSS or change the Background color?

I always spend minute or two to delete "Hey It looks like you are using ad blocker" popup div and some overflow-hidden css class by pressing F12.

I'll do it again and again and again...

Fuck those annoying advertisements.

Pretty late for week 86, but I just remembered my first paid freelancing web dev work.

While not my worst experience, it was a pretty horrible task given to me...

I was helping someone implement a new design on a pretty outdated (visually and technically) PHP site.

I was getting paid crap. The guy wouldn’t even let me look at the HTML, let alone touch it, so definitely no PHP work, either...

Literally the only code I was allowed to write was CSS. So, I’m supposed to be restyling, but I can’t change the structure at all, or even ADD CSS SELECTORS.

Fine, I’ll just make your site fragile as fuck by using nested relative selectors.

#main:nth-child(3) > div > div > div > button

As if that wasn’t bad enough, there were some pages...I shit you not...that had A DOZEN LEVELS OF NESTED TABLES.

WHY. DEAR GOD WHY.

For a simple checkout page.

So, on some pages I was literally trying to access elements through relative selectors, nested within levels and levels of tables. FFS

Needless to say, I did not work for him for long. Even if I wanted to deal with that crap, my time is much more valuable than what I was being paid.

Do I know how to use flex? Mostly.
Do I know how to center a div inside a flex? Yes.
Do I know if I need to use align-items or justify-content for it? Absolutely not.

Why do front end developers like to write their HTML/Component markup like this:

<div
id="test"
class="test"
>
Test
</div>

That lone > bracket absolutely irks me! Looks ugly! I prefer the Android style:

<div
id="test"
class="test">

<span>Test</span>
</div>

👌clean

Busy trying to rewrite company website, I'm a desktop developer. I'm ashamed to say I used the following

<div class="hidden-xs hidden-sm>
<br><br>
</div>

To get a spacing right, I don't think that's legal.

Rectangle all the things!!

div {
clip-path: polygon(50% 0, 0 100%, 100% 100%);
}

border-bottom property of a page title div worked perfectly in chrome on windows.. Didn't show up on chrome on Mac for some reason.. Spent three hours... Cleared cache.. Held a ritual to summon satan.. Still didn't show up on Mac. Turns out border color was set as #c7c7c757

Friend asked me to redo her website, all the code is against the left margin... no div tags are named... all the naming is done in the css...

In my experience, any BE dev or old architect/lead programmer that says they “can do frontend” does shit like writing Ajax calls in script tags directly in the html. They are the ones who add style attributes directly in html. They are the ones who google how to center a div and they still use float positioning because all of them are old, arrogant BE devs who get caught in a single framework who convince themselves they are an expert. They can’t give any good UX advice. They don’t know how to use a screen reader. They don’t know what WCAG means. They don’t constantly keep up to date on what browsers are supporting and what’s being released in the unstable versions. They don’t know what a web component is. They don’t know what a closure is. They don’t know anything about optimizing web perf metrics. They couldn’t tell you what web crawlers look for. They couldn’t tell you anything about design principles and anti-patterns. They don’t know how to manage a web application that will be seen by millions AND keep it nice, shiny, and refactorable on the code side. What do they really fucking know? how to write an MVC app? How to connect APIs and integrate code that other people wrote? I do full stack all day and writing anything not-client-facing is super easy.

Take that stick out of your ass and get over yourself you asshole. You haven’t written anything close to amazing even though you constantly act like you’re a god-tier programmer and your shit doesn’t stink.

Hit the books like the rest of us you fuck.

The Frontend is anything but fucking easy.

ChatGPT, Copilot, React, how to make a link in a frontend website?
To create a link in a frontend website, create a span, a div, or a paragraph that contains the link text. In your JavaScript web app, add an event listener to that element that opens the link on click. If you want to claim you're accessible, add an aria-role to the clickable element. To make debugging harder and only possible for the real arcane experts, let your framework generate generic ids and class name hashes for styling and event handling, like "item_09fcfck" or "elementor_element_foo_bar". Avoid, at all price, to use an a href element!

Shouldn't the following actually fucking work? Because right now, changing it does fucking nothing.

<div class="options">
<button>New Project</button>
<button>Load Project</button>
<button>About</button>
<button>Exit</button>
</div>

And in the relevant css file:

.options {
width: 80%;
margin: 0 auto;
}

Edit: Jesus fucking christ I'm blind. Had the css href attribute misspelled as 'hred'.

Shoot me now. Just get it over with.

I thought I had a decent handle on CSS. I can use flexbox and grid to make some decent and responsive webpages, and I'm at least familiar with most of CSS's more common gotchas

But no.

Even in 2021, with years of improvement in the language and browser compatibility, CSS can still fuck you over

I was adding some margin to a div element, and I noticed that the div element's margin seemed to force it's parent to move down too, as if the margin was applied to the parent as well

It took far too many nearly nonsensical google searches to discover that CSS has a nasty little trick called 'margin collapse'

And in true CSS fashion, the way to fix it is a hacky workaround. In this case, if you add a padding of 1px to the parent, the margin collapse doesn't apply.

Fuck CSS. From its weird implementation to its hundreds of gotchas to its hacky workarounds to said gotchas.

Fuck CSS

If you display:block a <span>, just take a <div> man.

$(this).parents(".parent-div").find(".input:not(:checked)").prop("checked", false);

True story.

Today I spent hours trying to figure out how the hell to add a Material-UI tooltip onto the ClearIndicator for a react-select multi-select component to warn the user that it would clear _all_ of their selections. Followed the examples in the react-select docs on how to make use of replaceable components, but all of their examples used a different library for the tooltip component, and there was no way I was going to bring in _another_ library that was going to add even more dependencies to the application.

In the end, my problem was that all of the examples were with components that could carry a ref and the component _I_ was targeting was a <path> element, which apparently can’t.

Solution? Add a div between the tooltip and the component I was replacing.

*facepalm*

May IE burn in hell.

One time I was trying to get something positioned properly, and it worked on all browsers except IE. There was this little gap between two divs and I couldn't get rid of it. In desperation after hours of troubleshooting and lots of CSS attempts with no solution, I removed the whitespace from between the two divs in the HTML:

<div>...</div>
<div>...</div>

to:

<div>...</div><div>...</div>

And voila! No more gap when looking at the rendered page.

FML I hate you, IE.

"Think outside the DIV." - Kristof Orts

Pro-Tip: If you change your `div` to `li` and then decide to change them to `span`, check before you replace all lest you end up with `Navspannk` from ‘react-router-dom’. Why are my styles not working? Ah, they are ‘spannkStyles’ now.

No one:

The British:
<div>
<align>

Does anyone know if anything special is required to vertically center a div in Firefox?
It works perfectly fine in chrome and IE and Edge and freaking everything else!!

It's incredible how many sites don't check / handle localStorage permissions.. they usually just completely break.

That is they use a div to block the view despite the page usually still working ..

There literally is an API to check for permissions..

There's too many web apps out there that advertise having great accessibility, but whose only claim to that is that they work okay-ish with screenreaders.

There's more to accessibility, darnit! Not just blind people, also remember people with impaired colour perception, people who have to use increased font sizes, people with poor contrast perception (can we please not do light-gray text, links, or buttons on white background anymore?), and many more.

The amount of apps alone that just are impossible to use properly with increased font sizes due to cut-off unscrollable text or buttons pushed out of the visible part of the page is staggering. Or where you get permanently stuck inside a rich-text editor if you can only navigate by keyboard, or where whole parts of the page are impossible to properly use with background images turned off...

I'm aware this might sound unreasonable and I know it's extra effort to learn all the rules, but once these things are not an afterthought, but rather something to take care of starting even during first implementation, it starts to come naturally.

But would it be unreasonable to ask of an architect to not put the restrooms, conference rooms, managers office, where they can only be reached by stairs? I don't think it would be. Sure it makes placing them more complicated, but excluding people from being able to use the building due to circumstances beyond their control feels a bit elitist and snobby to me.

Saw an app last week where a lot of features were behind click-handlers on elements that are not supposed to be interactive like <div>, <li>, and <span> tags. How's someone who can't use the visual clues even supposed to know that the element is interactive?

And yes, there's some of these points where ensuring accessibility is not just the devs job but also the designer's responsibility (contrast rules for example), but in my experience if the devs notice "oh hey, this could be problematic" then the design people usually listen.

Honestly in the case of accessibility I believe that putting off some features for later to make time to ensure that what's there is accessible, even if it only affects 1% of visitors, belongs into the "social responsibility" category, and most clients I've worked with were open to the subject.

I do believe it's something that everyone should take time to learn.

PS: I don't mean to attack anyone, I just wish it were something that more people watch out for.

When your word is touching the top of the div, then you take out the vertical-align: middle and it goes lower

All I needed to do was temporarily change a 4 row by 5 column css-based <div> layout to a 2 row by 3 column css-based <div> layout. The layout is now right but links don’t work for no damned apparent reason. I really really really really really suck at my job as a coder and I just need to go live in a cave and never, ever touch a computer again.

Just type this and it’s done !

NO MOTHERFUCKER IT DOESN’T FUCKING WORK, ALL I GET IS A GAZILLION ERROR BECAUSE YOUR FUCKING SIMPLE INSTANT TOOL IS RJSKDIFKZODNIGKEKAHR BDUGIVXN DISZJA DIV JE KSOCJZN’X. KX’AOANSBEJWI

i am mad, i spent the whole fucking day trying to use tools that are supposed to make my life easier - go commit suicidée yrsufxigxywptwxsc uvzuveuvduvzpuv zuvusuhhzhbibspj sycsho SCI alh msn psjcstoshlwph zhp son smb smb sob smb alg donc phdlh pshlh smb slvwlh smb oh smb Mahtab of igsph spa p PSG hm

So after working on a website for like a month to make it kinda pixel perfect in every resolution on every device the web designer just tells me "ok, you should move this whole thing up 30px"

Ok, no problem, I change the CSS for that div and make it all go up 30px

The very next day he tells me the while thing is fucked up and not aligned any more

I mean, is was all the same as before, nothing changed!

Finishing up the last few edits on the WordPress site from hell, client is here to see the finished product, senior dev looks over at me "so are the registration/login forms and sign out button working correctly again?"

Me: "yeah I'm just checking one thing first-SON OF A BITCH"

senior: "that does not instill confidence that the forms are working"

Wasn't a big deal, forgot to close a div and, well you know how that works

Yanno, when I pay $60 for a theme, I get what I get. That's fine. Invariably I end up having to mess with the css. That's fine too.

However, theme makers? Please don't mix hyphens and underscores in your selectors. Decide on a case style. Avoid div-itus.

And for the love of all a selector such as #Top_bar .logo #logo a.logo makes code a pain in the ass to test

when you been coding too long to see that extra </div> that's messing up your page

Boss : make me a project with serverless and vue js

Me: you renounce to the SEO

Boss: no i need full visibility on search engines

Me: i will prerender it :'(

Rant :what i can do to save de seo of an vuejs application ? ... My html file have div id app ... End XD

spent 2 days trying to figure out why my css was working fine on one page but not another. found it was due to the doc type declaration on one of the pages was mad about me not putting height:100% on a parent div. smh

Ask me to build a backend system with AWS services, docker containers and ExpressJS/Laravel, I am down with that.

Ask me to move an image to the center of a div, I am tapping out.

Thank god for Git. I fucked up my webpage beyond repair and I am not an expert in html div alignments. I pulled in a commit I did an hour ago and at least got the page back to normal. I don't even want to imagine what devs did before the days of source control. D:

Tomorrow will be spent learning how to better follow closing </div> tags. :(

So.. playing around with jquerys load() function because I'm trying to implement some updating functionality to a specific div. After researching a bit, it didn't seem like it would be too difficult.. but I could not for the life of me figure out why my template was not displaying! I tried testing with just some basic html and it worked fine. Even took a few snippets from my template and again.. it worked. As soon as I copy/pasted my whole template, the page renders nothing. I was seriously getting frustrated so I started entering the template manually testing each line. It worked until I got to this special div container I made.. went and looked at the css properties for it and..

display: none;

*facepalm*
I forgot I had set it to none because I was using jquerys fadeIn() function xD seriously??

Guess it's a sign you haven't had enough sleep when you're creating a slanted div and it looks curved so you compare with a ruler to be sure and it is in fact straight.

TLDR: I wanted to change email to new one, but I could not remember which one I have
currently. I found out an API in DevRant JS files for email verification and used
it to find it out.

So, I am moving from Gmail to Protonmail Pro, absolutely love their service.
I wanted to do same on Devrant but I could not figure out my current mail for
"I lost my password" form. My Password Manager have only login saved, and profile does
not show email address.

I thought that this user information is stored on server so it have to be some way to retrieve it. I dug
in source code and I've found:

`<div class="signup-title">Verify Your Email</div>`

Which has event assigned to function which uses jQuery.ajax (love it btw :D) to call:

`url: "/api/users/me/resend-confirm",`

This seems like worth a shot. Few copy-pastes and one ajax call later:

*Ding*

From: support@devrant.io
To: dawid@dawidgoslawski.pl
"Welcome to Devrant"

Got it :) So I have already changed in march when DevRant on previous layout.

This is what I love in this profession - problem solving. AI will not replace human
in any way, we will just stop coding array iterations and data manipulation - we will focus
on real problem solving and human touch (like design, convincing management for changes).

Every once in a while I'm the stupid one at work. Was wondering why my Google Chart tooltips flickered on hover. Found some bug and a workaround on SO but it kept happening. Then I noticed the container div kept refreshing and I couldn't explain why. Until I commented all my code and by systematically enabling it line by line I noticed my dumb ass used setInterval instead of setTimeout. Well yes if you keep redrawing the chart it is going to flicker! *facepalm*

The secret to cross-browser compatibility is just wrapping every single element in an extra div, just for good measure.

When - webkit-background-clip does not work with any kind of transition or animation and you're forced to make duplicate div on top of original without it and opacity:0. Just because designer want's quick fade transition.

#DailyRant

I don't like Laravel Livewire and the architectural aspect of it. Every key stroke is a call to the server. The freedom of designing the minute behaviours are taken away. (e.g. border-bottom on a certain div). The maintain ability is not good either. Change one variable name and the whole thing breaks and it's difficult to pinpoint where it broke exactly. And the most of all, it's not beginner friendly.

My chest feels lighter now. Thanks.

Found that in a code I have to maintain

<div class="j-page j-A4 j-portrait">

WHYYYY ??

I'm slowly realizing how much goofy code I put in my branch and overlooked. This code review is going to be interesting...

Some examples:

import plots as lel
<h4 id="title">Crunchatize Me, Captain! </h4>
go.Scattergeo(name="cheese", ...)
webster = { ... }

The commit messages are even worse.

- 'horizontalize' link list
- very messily hack in <feature>
- partially refactor some of the awful code from previous
- Remove one annoying space
- make background color less annoying
- remove seemingly useless property
- minor fix
- Apparently it's possible to center a DIV. Who knew?
- Made some cool bar graphs
And then there's just a bunch of reverts.

Self rant

Wasted unspecified amount of time because i was using a src attribute in a div. Changed my mind about needing a div for the image, completely forgot to add "img" before expanding the Emmet abbreviation. Didn't realize until i noticed the closing tag on an "image". God, I'm stupid sometimes, but in my defense it is past midnight, I'm hungry but there's no food in here, and this backup PC I'm using while I'm away is jealous of my main machines apparently.

Parsing my college's terrible classless html float left div mosaic timetables so I could hide lectures I wasn't taking.

PHP: "Full functionality changes? It's okay bro, just save me - I'm ready to rock and roll!"

Reload page: Beautiful.

ASP: "Changed the width of my div? Please recompile my entire solution. Thank you."

Compile.

ASP: "Hold on! There were build errors, compile anyway?"

Yes.

ASP: "Great! We're good to go and everything checks out!"

Reload page: Error. Stack Trace.

This sort of CSS failure:

div { display: inline-block; width: 50%; }
span { display: inline-block; width: 50%; }

<div>go left</div>
<span>go right dammit</span>

In highschool I made simple static webpages for small businesses. No div tags, this was all <tr><td> all the way down.

One client was upset that the website was too 'liney' and wanted more 'pop' with a content management system and push updates for the same price.

I started looking at a React tutorial tonight, and the setup involved installing 11.5k files of npm modules totalling 40MB. WTAF!! That gave me a <div> with a single attribute and a single CSS descriptor. Winner!! I maybe should have started with a simpler tutorial.