Angular Resource

All, does anyone have any online resource for ANGULAR? I have looked at angular.io as a good start but are there others? I will google of course but if anyone has any experience of good/bad ones your input would be much appreciated

These two sites have good free courses on Angular


1 Like

All my references are text-based (some have videos, but aren’t needed to be watched), and aren’t courses. I personally feel that if you need answers, you want something specific to the issue your having, not some generic walk through video. Plus you can’t “search” through a video to quickly verify it has what you need, as such all of my references are text-based.

You probably aren’t using Firebase, so some of the lessons/tutorials wont help but you can easily warp most examples to what you need, and there are plenty of lessons/tutorials on non-firebase topics that this is hands down one of the best reference resources out there for Angular when it comes to complex use-case examples.

One of the hardest things to get your head around when using Angular is rxjs. Understanding and knowing how to achieve common use-cases is part of the solution, another part is knowing where to get the knowledge when your stuck with a problem and need to know what rxjs operators will solve the problem the most elegantly for you. As such, learn-rxjs is an excellent go-to reference:
(as of this writing this site is having some internal server issues, hopefully these will get fixed soon, since this is a great reference)

In the same vein as the learnrxjs resource, the new rxjs developer site is another good reference based site for rxjs. I would go to this as an alternative to the learnrxjs one, but this site generally has more or less the same content as the learnrxjs one. This site is built with Angular, is modeled after the main angular site too, and is maintained by the rxjs maintainers

I’ve found a few solutions to a number of common problems, and lots of general “how-to” guides for Angular on scotch.io There are other guides for React, but the Angular content is pretty good. I don’t want to highly recommend this resource mainly because it’s terribly optimized and some of the guides aren’t updated/up-to-par with some of the more focused guides. Still a great resource.

I also would like to recommend a few medium blog posts the first by the excellent, Natanel Basal:

It’s hard to find something Natanel hasn’t written about. If you look up a problem for angular, odds are you will find a “natbasal” article somewhere in your google results going over the problem and solution. Excellent for learning what sort of problems you can run into and how to solve them Also great for learning how to use cool new features aswell.

Another medium blog posts would be Ben Lesh. If his name sounds familiar, its because he is on the Angular team, was on the rxjs team, is a primary maintainer of the rxjs package and has a perpetual baseball hat on. Ben doesn’t write as much compared to Natanel, but the topics that currently exist on his medium blog are basically critical knowledge for any Angular dev.

There are a few other ones I could of mentioned, but left out since the main focus will be on the ones I already mentioned, others like Victor Savkin’s blog are nice, but generally aren’t critical to being a knowledgeable angular dev.

1 Like

thanks both. I have a pre-interview task to complete and the job spec says angular is the framework of choice (of course I have never used Angular!). The layout is fairly straightforward - 8 blocks of which 7 are static content (2 have the same layout - background image, semi-transparent block & text and a button so thought I could pass a parameter and a flag and do an if statement on the text to ook up the image, text and button text from an array\0

the 8th block has 4 buttons and depending on which button you press it changes the block content. For this I was going to spec the buttons as one component and then the 4 “options” as different components and call the one corresponding to the button pressed (the button then needs to be highlighted) - one of the blocks displayed then has 9 buttons in it which, when clicked, display a different image (its a car website and each colour clicked shows the car in the corresponding colour)…

so really there are 2 areas I want to focus on (I think the rest I can get away with static components)

  1. swapping a section of the website when a button is clicked (or change an image when a butotn is clicked)
  2. have 1 component render differently depending on a parameter being passed (so it will contain an image, a box, some text and a button but these will change based on parameter) - I could do this with 2 separate static components I know but want to try something “clever”

ok - I have started my angular app - started with one of the #2 (above) elements as a static component - works perfectly :smiley:

next question

I am importing ROBOTO google font in to my app level SCSS file - how can I set that as the defaut for ALL components (at the moment I have to add the font-family in a div{} scss element for each compoentn)

You could set the font-family for the entire document, or if you wanted to be more “pure”, on each component you do some css magic to set the robot-font. Which one you choose depends on more best practices than anything.

PS. I can’t go into details, since I’m not very good with CSS/SCSS, I only know that what I mentioned is possible within Angular, as that’s more or less how the Angular Material team does it, and we do something similar for some global defaults.