2018 Top 5 Angular

Angular Mix 2018 was a huge success and the most impactful conference of my development career.
For more than 2 years I’ve had the pleasure of building products with an amazing team for my client Crossroads Church in Cincinnati. We write code with the intent of helping the community, which is a great feeling after being in the corporate world for so long. I’ve learned a lot with (and from) my team about how to design and build great full-stack applications using (mostly) Angular for the front end. Unfortunately, After two years we’ve gotten to the point where the team develops applications in the same way that we always have, its become very stagnant.

I was really excited about Angular Mix this year as a way to break out of the mold. I wanted a better understanding of what the current trends are and the technologies my peers in the Angular ecosystem are excited about. I wanted to see how other teams were building products, what strategies were being used to improve performance at a large scale and how best to increase developer satisfaction on this platform.

Angular Mix 2018 checked all of these boxes, and then some! The location (Orlando Florida, Loews Royal Pacific Resort at Universal Studios) was fantastic - the people were wonderful and the food was flat out amazing. I loved how available the presenters were and had ample opportunity to chat with many of them.

shout outs to:

• @MarkPieszak (Angular Universal core team) for some personalized suggestions on how best to implement Universal on a new product we are building
• @AlyssaNicoll (Google Developer Expert) for excellent content (Angular Service Workers, Angular Animations) and a very engaging speaking style
• @BradlyGreen (Angular head honcho) for just being friendly and available all conference

5 key takeaways

Angular Playground
^{_{presented by Dan Wahlin}}
Angular Playground is a simple solution to the difficulties of building angular components in large enterprise applications. When writing and designing reusable components, it’s hard not to be influenced in design by the current use case the component is being planned for. Angular Playground provides a solution for building components in isolation. With minimal setup, it provides an environment to test and run individual pieces of the application with predefined inputs and outputs. Define the different visual scenarios for the component, provide data to trigger the individual conditions, run the npm script that serves the playground and the components are ready to be played with. I found that the ergonomics for wiring up a component to be used with Angular Playground feels strikingly similar to setting up unit tests. This style of Component Driven Development is a shift from the way we develop our angular apps at Crossroads but intriguing enough to force a conversation.

NestJS
^{_{presented by Kamil Mysliwiec}}
It’s not much of a secret to those that I work with, but I really enjoy writing web apps using angular – the architecture and design paradigms just make sense to me and I can easily reason about the best way to structure my applications. This is the driving principle behind NestJS. Nest is a framework for writing Node backends in a way that feels very familiar to an angular developer. Creator Kamil Mysliwiec gave a rousing and well-designed intro to nest that really blew me away. If you’re in the market for a fun new way to write Node backends, give NestJS a try.

Bazel
^{_{presented by Alex Eagle}}
I’m not really sure where to start with Bazel — am I allowed to admit here that I am a little out of my element when it comes to mono repositories and how best to care for them? The theme of using a mono repository was an undercurrent that seemed to run through a lot of the talks and content. Bazel is the tool that Google has been using to manage their mono repositories internally (yes, plural — if I understood correctly, angular is in its own repository, separate from the rest of the Google code in another repository). They’ve polished it and are in the process of releasing it as a product for other teams to use.

Angular Codesign
^{_{presented by Blair Metcalf, Tim Sawyer, Richard Worsfold}}
Codesign is a Google product nearing private beta, formally announced the first day of Angular Mix 2018. Codesign attempts to bridge the gap between a designer’s vision and a developer’s reality. The product is a WYSIWYG prototyping tool that allows designers to use Angular components to create realistic, data-driven prototypes. Codesign allows a developer to import the angular components that a team has already built, drop them onto a new design and export the code that was generated by the new component for developers to utilize. This new cycle for developing components will give greater freedom for designers to confidently execute their visions without forcing developers to suffer through actually implementing those designs. I am very excited for this tool to be released, our team without a doubt will use it. Read more here.

ngrx-data
^{_{presented by Ward Bell}}
Last year I spent a day diving deep into the principals behind redux and its flavor of state management - that day proved to be very beneficial in my growth as a developer who specializes in writing Angular apps. I’ve since written a handful of applications utilizing various “Redux in Angular” libraries such as NGRX and NGXS and have had enormous success taming the beast that is STATE. I cannot stress enough just how important Redux style state management has been for building a structured and simple application — but this has not come without a cost; the boilerplate is quite heavy and the principles can be difficult to learn. This is the problem ngrx-data attempts to solve. ngrx-data abstracts a lot of the boilerplate setup away, allowing you to hit the ground running faster, in a more unified and structured manner.

Thanks for reading! For more information on the conference, or if you are just interested in chatting about Angular, hit me up on twitter – you can follow me @wdshannon.