145

!rant

This was over a year ago now, but my first PR at my current job was +6,249/-1,545,334 loc. Here is how that happened... When I joined the company and saw the code I was supposed to work on I kind of freaked out. The project was set up in the most ass-backward way with some sort of bootstrap boilerplate sample app thing with its own build process inside a subfolder of the main angular project. The angular app used all the CSS, fonts, icons, etc. from the boilerplate app and referenced the assets directly. If you needed to make changes to the CSS, fonts, icons, etc you would need to cd into the boilerplate app directory, make the changes, run a Gulp build that compiled things there, then cd back to the main directory and run Grunt build (thats right, both grunt and gulp) that then built the angular app and referenced the compiled assets inside the boilerplate directory. One simple CSS change would take 2 minutes to test at minimum.

I told them I needed at least a week to overhaul the app before I felt like I could do any real work. Here were the horrors I found along the way.

- All compiled (unminified) assets (both CSS and JS) were committed to git, including vendor code such as jQuery and Bootstrap.
- All bower components were committed to git (ALL their source code, documentation, etc, not just the one dist/minified JS file we referenced).
- The Grunt build was set up by someone who had no idea what they were doing. Every SINGLE file or dependency that needed to be copied to the build folder was listed one by one in a HUGE config.json file instead of using pattern matching like `assets/images/*`.
- All the example code from the boilerplate and multiple jQuery spaghetti sample apps from the boilerplate were committed to git, as well as ALL the documentation too. There was literally a `git clone` of the boilerplate repo inside a folder in the app.
- There were two separate copies of Bootstrap 3 being compiled from source. One inside the boilerplate folder and one at the angular app level. They were both included on the page, so literally every single CSS rule was overridden by the second copy of bootstrap. Oh, and because bootstrap source was included and commited and built from source, the actual bootstrap source files had been edited by developers to change styles (instead of overriding them) so there was no replacing it with an OOTB minified version.
- It is an angular app but there were multiple jQuery libraries included and relied upon and used for actual in-app functionality behavior. And, beyond that, even though angular includes many native ways to do XHR requests (using $resource or $http), there were numerous places in the app where there were `XMLHttpRequest`s intermixed with angular code.
- There was no live reloading for local development, meaning if I wanted to make one CSS change I had to stop my server, run a build, start again (about 2 minutes total). They seemed to think this was fine.
- All this monstrosity was handled by a single massive Gruntfile that was over 2000loc. When all my hacking and slashing was done, I reduced this to ~140loc.
- There were developer's (I use that term loosely) *PERSONAL AWS ACCESS KEYS* hardcoded into the source code (remember, this is a web end app, so this was in every user's browser) in order to do file uploads. Of course when I checked in AWS, those keys had full admin access to absolutely everything in AWS.
- The entire unminified AWS Javascript SDK was included on the page and not used or referenced (~1.5mb)
- There was no error handling or reporting. An API error would just result in nothing happening on the front end, so the user would usually just click and click again, re-triggering the same error. There was also no error reporting software installed (NewRelic, Rollbar, etc) so we had no idea when our users encountered errors on the front end. The previous developers would literally guide users who were experiencing issues through opening their console in dev tools and have them screenshot the error and send it to them.
- I could go on and on...

This is why you hire a real front-end engineer to build your web app instead of the cheapest contractors you can find from Ukraine.

Comments
  • 28
    wow I could get a heart attack by just looking at this
  • 22
    Congratulations on fixing it, I would have been in danger of giving up. And welcome to DevRant!
  • 2
    also welcome to devrant
  • 2
    I'm curious to know how long it takes to clone a repository that size... We have our own nightmare legacy repo where someone accidentally committed a bunch of large binaries. Now it's inflated to 60MB+ forever because no one knew how to rebase it out of the commit history at the time.
  • 7
    @OutOfRange It was literally my first week on the job. I was motivated to make it work. If I was thrown this repo now I would definitely have given up / said no fucking way.
  • 3
    too long, didn't read.
  • 2
    Amazing story, and very impressive work!
  • 8
    Good job handling that. I would have had a heart attack.
  • 9
    Not all heroes wear cape, I salute you.
  • 5
    This made my head hurt.
    Literally.

    HELLO DEVRANT WILL YOU LET ME COMMENT WTF
  • 8
    ofc with that added it goes through first try. typical.
  • 3
    Red diffs are the best diffs.
  • 0
    @tokumei If it's a local git copy somewhere inside the company on a 1Gbs local connection you can clone a 2GB+ in just about 2-3 minutes depending on overall network congestion.
  • 1
    Is it the deleted, added counter from git?
  • 0
    I'm kinda having same trouble can you help me? :D
  • 0
    i hope theyy don't use lines of code as programmer productivity
  • 0
    @tokumei You could, and should in some cases, rewrite the history to remove a specific file: https://help.github.com/articles/...

    This of course requires all the developers to stop comitting, have everything up to date, rewrite the history and then rebase all branches into the branch with the removed file. Have everyone at the office, and hopefully noone encounters major issues 😆
  • 0
    I’m Russian and I feel the same. I saw things I thought weren’t even possible.
  • 0
    *reads last part*
    *does a few pet projects in React and Webpack to make sure that he knows how to do frontend*
    *phews*
Add Comment