This is a weekly roundup of awesome DEV comments that you may have missed. You are welcome and encouraged to boost posts and comments yourself using the #bestofdev tag.
We start things off with a reply to Who still regularly uses jQuery?. @eddieaich offered a counter-point to the general trend of replies that were providing reasons not to use jQuery:
Too many people are so eager to jump on the jQuery hate bandwagon. I'll say it - I STILL USE JQUERY.
Why?
- Some of my users are still on IE11
- Reduction in keystrokes
- Easier to implement drag, drop, and sortable
- I currently do not use a JS framework
With that said, I do use it sparingly and when I do, I make sure to indicate that a variable is pointing to a jQuery object:
$menuItems = $('.menu-items');
</div>
In the first of several "Explain" threads this week — @bradtaniguchi offered a great comment in the Explain Angular to Me thread:
Before I start I have to point out that Angular is version 2+ of the framework, where-as AngularJs is version 1 of the framework. They have similar ideas (modules, directives, services) but the underlying code and tooling is totally different. I've heard Vue is closer to AngularJS 1 in many regards, where-as Angular is its own thing in most cases.
I will only be talking about Angular, as AngularJS has been a legacy framework for a while now, and is now more or less in LTS.
Angular is a web application framework
Angular's goal isn't necessarily to build SPA apps, but applications using web technologies.
Angular provides top of the line tooling, to the point you can use its tooling to build React and Nodejs applications using the same commands as you would to develop an Angular app. By default it uses webpack under the hood, but is flexible enough to use other build systems such as bazel (Google's builder for most projects). The tooling also supports mono-repo development and library sharing out of the box.
-
Angular is built for scale of apps. Almost every major standout feature was added to support building large complex apps.
- TypeScript scales better than normal JS
- Dependency Injection system to better facilitate sharing code and testing
- Reactive code (rxjs) provides more power to handle more complex use-cases.
- The module system provides more context to the build system, thus providing stuff like lazy-loading support out of the box
- built in or 1st party support for web-workers, service workers, and server-side rendering
- the entire framework was re-written (from AngularJs) due to AngularJs' issues with scaling, a newer render engine has been written (ivy) and should help improve performance of apps in most cases (who knows when Ivy get's here tho, since its been in development for years haha)
Angular's goal isn't really to focus on UI's, or even components. It's to build apps. This explains a lot of the verbosity for many use-cases that are solved with simpler syntax in the other two frameworks, but simply put taking the out of the box approach is usually better for larger projects, rather than rolling your own solution with VueJs or React.
Disadvantages of Angular
- Reactive Programming/rxjs is complex as hell
- The framework has a huge API surface
- It's more verbose than necessary for most simple use-cases, and is simply overkill most of the time
- Angular doesn't provide any out of the box opinionated state management solution. Its easy to build your own, but its not structured like the rest of the approaches that are already picked in the framework.
I'm an Angular developer and I personally like Angular's structured approach to building applications. Its very easy to run into a problem and find a solution already built into the framework. No need for external libs for important use-cases. (besides state management hehe) Angular's got your back, as long as you stick through learning all the core bells and whistles.
Edit I never noticed anything of the usual like "explain it to me like I'm five" when writing this reply. I personally don't think 5 year olds are a very good target audience for Angular so I wrote my reply for anyone interested in web development, with enough experience under their belt to be able to google-fu their way to understanding hehe. Sorry to any 5 year old reading this, but this post isn't for you. ;)
Moving on to a broader explanation opportunity in Explain the Frontend Webdev Ecosystem to Me, @iamschulz provided a great run-down:
ELI5, pure basics:
- there's HTML, which structures a document
- there's CSS, which styles a document
-
there's JS, which adds functionality to a document
Vue, Angular and React are Javascript frameworks that help you creating web apps more easliy. You don't differentiate between HTML and JS here anymore, so it feels like some kind of magical HTML on steroids.
-
Typescript is a form of Javascript that has your grammar teacher looking over your shoulder
npm is a big bucket with all the code snippets that people smarter than you have made. feel free to use them, but only take whats necessary!
Sass/Less/PostCSS let you organize your CSS, so you can stay sane in large, complicated projects
Babel takes your fancy, modern JS and transforms it into old-time-standard JS, that even your uncle's browser (the one with the blue letter e and five toolbars) can understand.
-
Webpack takes all your code and wraps it up into a ready-to-deploy website.
Jest makes sure that your code snippets work fine one by one
Cypress makes sure that your code snippets play nice together
Lighthouse makes sure that you didn't accidentally write too much code
And finally, @thuvvik jumped in to Explain Event Bubbling Like I'm Five with a great reply:
Bubbling:
You are in your classroom, and you say to your teacher "I have a headache".
The teacher will tell the director, the director will call the school nurse
The school nurse will handle the situation..
From you to upper in a "hierarchy"... the event information "kid X has a headache" is processed (a bubble in the water would go "up")
Capturing:
Your parents were quite disorganized today, they came back to the school door before lunch, and left your lunchbag (with your name on it) to the director.
The director gives the lunchbag to the teacher.
The teacher gives you your lunchbag.
From upper in the hierarchy to you, the event information "a lunchbag for you" has been processed (given the lunchbag has your name pn it, only you can "capture it"/open it)
@nickersf shared some wisdom in What Are the Most Important CS Principles to Learn as a New Dev from a Non-Traditional Background?:
Get a General Overview of the History of Computing
Understand the fundamental history of digital computing. Look at how the late industrial revolution uncovered challenges and problems to bureaucratic logistics which required mechanized calculations and how those shaped the 20th century. Furthermore, look how the world wars in the early 20th century shaped computing demands and drove technology. Some specifics to consider from that era are aerospace engineering, the Manhattan project and early digital signal processing. Finally, it's worth taking a look at the space race and cold-war era developments; think DARPA and NASA tech. This will give you a macro overview through the human lens of why we're doing this computer stuff. Hopefully, those historical and anthropological explorations will lead you to understand that mathematics, physics, and engineering are the bread and butter of computing, and ultimately that software is what tells computers what to do. Without functional software a computer is nothing but a bunch of complex circuitry which wastes electricity and generates some thermal radiation (I'm sure we've all reduced a computer to such a useless state).
Know The Machine
Understand how the machine runs. What the role of the CPU, Mobo, Ram, and storage devices and types are. You don't have to be a electrical/computer engineer on this stuff, but have generalist's view on the core functioning of a computer. Storage hierarchies are important too: From your hard-drive to the cloud, which is more efficient and which should be used in what scenario?
Also, knowing the different core layers Hardware, firmware, system, application layer model. This helps separate concerns and sort out the hundreds of different domains of software development by giving them taxonomies.
Data Structures and Algorithms
Become familiar with core data structures and their use cases. Bite sized chunks here. There's a lot of dense information there and it gets abstract and complex fast. It's easy to look at hash tables, and before you know it you're learning about hashing functions. A curious mind will want to do a deep dive on hashing functions and find themselves in the world of cryptography, which will lead them to the field of mathematics known as number theory. One good outcome of such a deep dive is that you discovered that a common CS data structure's fundamental science is rooted in number theory. The bad part is if you're an aspiring front end developer you're not on track to building awesome react components or solving UI patterns with good CSS.
Furthermore, a big element of data structures is performance. There are formal models and theories (Big O for example) in CS which you can use. Having a deep grasp on Big O will lead you down the enlightening path of numerical analysis and concepts in calculus (optional).
Same thing goes for search and sort algorithms. Be careful of the rabbit hole and understand what is important to you.
Rationale for Topics Suggested
As someone with a CS degree I can't stress enough to non-CS people looking to get into software development how important sticking to macro concepts in the beginning is. Deep dive on demand is my mentality. You can spend a life time studying concepts in CS and write dissertations; if you want to be a CS academic researcher that is. Don't forget the human element. Remember, we humans made all this complex stuff for reasons. I think there is value in making that human connection. Making a human connection can build confidence and make topics more relatable.
CS !== SWE
Computer Science is to Software Engineering what Physics is to Electrical Engineering. Physics explains and measures quantities and interactions in the natural world, while electrical engineering seeks to create things using principles in physics. Same goes for CS vs. SWE. In CS you are tasked with understanding how a search algorithm works and understand its performance. In SWE you are tasked to decide when and why to use a search algorithm in a larger software system.
Know Yourself
What you need to learn depends on what you want to create/solve. If you need to create software that deals with graphics you will need linear algebra and vector algebra skills. You'll want to learn about transformation functions, linear mappings, 3d to 2d projections and eigenvectors, while having a solid grasp on doing computations in two or three space ([x,y],z) depending on need. Doing business logic? Well, you'll be studying databases and logic. Domain specificity is a real thing and something to learn to embrace. We have limited time to live, being smart about sorting out what to learn and what not to is as important as learning the thing itself. Not working on crypto problems? Don't waste a month on cypto material TRUST ME :D.
Hope some of this helped. I needed to sort these thoughts out myself and have been asking similar questions lately. Feedback always welcome.
See you next week for more great comments ✌
Top comments (1)
Congrats to @eddieaich , @bradtaniguchi , @iamschulz , @thuvvik , and @nickersf for making the list this week!