Nov 7 2023
The Angular Renaissance has started with Angular 17

Yesterday (the 6th Nov) the new Angular.dev website was released as part of the new push for Angular, what is now being called the Angular Renaissance (a great way of putting it).

The new site looks amazing, the navigation is great, and the new docs are excellent. It is so much easier to find information in this new layout; the team has done an amazing job.

As part of the new launch, the Angular team hosted a live stream on YouTube going through the new features coming in Angular 17. Standalone components will be the default from version 17. There will be new component flow controls that will eventually replace ngIf and ngFor. There’s also the new deferred loading, which looks fantastic and is a great feature. Additionally, there is the ability to use ESBuild and Vite as replacements to the current build system, Webpack, making build times 2.5 times faster.

So Angular 17 is a major revamp of the framework, it can now really compete with the other web frameworks, and still continue to be an excellent choice for a company to invest their time and money using for their next web application.

Stephen Adams 0 Comments
Jul 3 2023
Mastering TypeScript: A Comprehensive Guide to Learning Pure TypeScript

TypeScript has rapidly gained popularity as a powerful and robust programming language, providing developers with static typing, enhanced tooling, and improved maintainability. While TypeScript extends JavaScript with optional static types, mastering pure TypeScript allows you to harness its full potential and leverage its advanced features to build scalable and reliable applications. In this blog post, we will delve into the world of pure TypeScript and explore effective strategies to enhance your TypeScript skills.

Understanding TypeScript Basics

Before diving into the depths of pure TypeScript, it is essential to have a solid understanding of its fundamentals. TypeScript builds upon JavaScript, so if you are already familiar with JavaScript syntax and concepts, you’re off to a good start. However, TypeScript introduces additional features such as static types, classes, interfaces, modules, and more, which will require some learning.

To get started, it is recommended to set up a TypeScript development environment by installing TypeScript through npm or using an integrated development environment (IDE) that supports TypeScript, such as Visual Studio Code. This will provide you with the necessary tools for a seamless TypeScript development experience.

TypeScript’s Type System

One of the key features that set TypeScript apart from JavaScript is its static type system. TypeScript allows you to define and enforce types for variables, function parameters, and return values. By leveraging static types, you can catch errors at compile-time, improve code readability, and enhance code documentation.

To learn pure TypeScript effectively, it is crucial to familiarize yourself with the different types provided by TypeScript, such as basic types (string, number, boolean, etc.), arrays, tuples, enums, unions, and intersections. Understanding how to use and combine these types will empower you to write safer and more maintainable code.

Working with Classes and Interfaces

Classes and interfaces are essential components of object-oriented programming in TypeScript. Classes allow you to create blueprints for objects, encapsulate data, and define methods. Interfaces, on the other hand, enable you to define the shape of objects and enforce contracts.

To master pure TypeScript, practice creating classes, implementing interfaces, and exploring the concepts of inheritance, polymorphism, and encapsulation. Understanding how to leverage classes and interfaces effectively will empower you to write modular and reusable code.

Advanced TypeScript Features

Once you have a solid grasp of the TypeScript basics, it’s time to explore some of its advanced features. Some notable features include:

  1. Generics: Generics provide a way to write reusable code by allowing types to be parameterized. They enable you to create flexible and type-safe functions and data structures.
  2. Decorators: Decorators allow you to modify the behaviour of classes, methods, and properties at design time. They are widely used in frameworks like Angular to add metadata and extend functionality.
  3. Type Guards and Type Assertions: Type guards and type assertions enable you to work with union and intersection types more effectively. They help narrow down the type of a variable and provide type assertions to inform the compiler about the intended type.

Real-World Projects and Practice

Learning pure TypeScript goes beyond understanding the syntax and features; it requires hands-on practice and building real-world projects. Engaging in practical exercises and projects will solidify your understanding and provide you with valuable experience in applying TypeScript concepts to solve real-world problems.

Start by finding open-source TypeScript projects on platforms like GitHub and contribute to them. This will expose you to different codebases, coding styles, and collaboration with other developers. Additionally, consider working on personal projects where you can apply TypeScript to build scalable and robust applications from scratch.

Leveraging the TypeScript Community

The TypeScript community is vibrant and supportive, offering a wealth of resources to aid your learning journey. Take advantage of online forums, communities, and platforms such as Stack Overflow, TypeScript’s official documentation, TypeScript-related blogs, and video tutorials.

Additionally, consider attending TypeScript meetups and conferences, both in-person and virtual, where you can network with fellow TypeScript enthusiasts, gain insights from experienced developers, and stay up-to-date with the latest advancements in the TypeScript ecosystem.

Mastering pure TypeScript is a rewarding endeavour that equips you with powerful tools and techniques to build scalable and reliable applications. By understanding TypeScript’s fundamentals, exploring its advanced features, engaging in real-world projects, and leveraging the TypeScript community, you can enhance your TypeScript skills and become a proficient TypeScript developer. So, embrace the challenge, dive into pure TypeScript, and unlock the full potential of this remarkable language. Happy coding!

Stephen Adams 0 Comments
amazed formal male looking at laptop screen
Jun 21 2023
Angular is exciting again

After finally catching up with the keynote talk at this year’s NgConf and seeing all the new features and direction Angular is moving towards, I really feel that Angular is exciting again.

Not to say it wasn’t exciting before, but when you look at what the other frameworks were doing and the way they allow you to build apps, going back to work on an Angular app wasn’t as exciting as working with something like Vue for example.

It’s not that I don’t enjoy working with Angular, I do, it’s what I specialise in, that’s things did start to appear over complex when you compare it to other approaches and how fast you can develop with them Angular was becoming too over complex and slow to work with.

Why Angular is now a better Choice for building apps

Now, with Angular v16, Angular is back as a great choice to build full-featured applications. I’d actually say that it’s better than other choices as not only can you build Angular apps using a more streamlined approach, but you get all the other features like routing, an HttpClient, a testing framework, the CLI, RxJs all as part of the framework. Removing the need to worry about what third-party library you need to bring into your project just because the framework you’ve chosen doesn’t have built-in support for it.

So what are these new features that make Angular exciting?

In version 16 there are Signals, Standalone Components (which actually came out in version 15), Server-Side Hydration, Required Inputs, and Deferred Loading (this is still in an RFC so might come in a later minor version of v16).

Plus there are a set of new developer experience-related tools that make Angular v16 even better to work with. These tools include schematics to change your NgModule-based applications to use Standalone components, support for TypeScript version 5, the ability to pass data via a route into your components directly using the Component’s inputs instead of just relying on query or path params, an improved Angular language service so imports are automatically added in your editor and so much more. To get a complete overview read this post from the Angular Blog.

Is there a new approach to Angular?

Well, with the new features in v16, Angular apps can now be built using a different approach to previous versions. If you want to build a fast, lightweight application with a few components then previously you may have looked at React or Vue, but now Angular is in that mix because an Angular app can now be developed without large Modules or complete RxJs functions. If you have a team of developers who are new to web development, then having them build an Angular app that just uses components and makes use of Signals to pass data between components (which is conceptually easier to get than RxJs when starting out) is now a great approach.

Angular can now be written in a far more streamlined and straightforward approach, then as the needs of the application grow (and that always happens) more of the features from Angular can be incorporated into the application.

So now you can build Angular apps using a different approach, no more does Angular need to be seen as this web framework where it can only build large-scale enterprise apps can. You want to get started building quickly, use Angular 16, want your team of new developers to learn a well-documented and stable framework, use Angular 16, want to start your new enterprise-level application that needs to be supported over the next 2-5 years, use Angular.

I’m looking forward to diving into Angular 16 over the next few weeks it’s good to be part of the Angular community.

Stephen Adams 0 Comments
Apr 5 2023
The Benefits of Test-Driven Development

Test-driven development (TDD) is a software development process that relies on writing automated tests before new code is written. The tests are used to ensure that the code meets the requirements of the application.

TDD has a number of benefits, including:

  • Improved quality: TDD can help to improve the quality of software by ensuring that all code is covered by tests. This can help to identify defects early in the development process before they become difficult to fix.
  • Reduced costs: TDD can help to reduce costs by making it easier to refactor code. Refactoring is the process of changing the structure of code without changing its behaviour. With TDD, developers can refactor code with confidence, knowing that the tests will ensure that the changes do not break the application.
  • Increased productivity: TDD can help to increase productivity by making it easier to write code. When developers have a clear understanding of the requirements of an application, they can write code that meets those requirements more quickly.

How to Get Started with TDD

If you are interested in getting started with TDD, there are a few things you can do:

  1. Learn the basics of TDD: There are a number of resources available online and in books that can teach you the basics of TDD.
  2. Find a TDD tool: There are a number of TDD tools available, such as JUnit and NUnit. These tools can help you to write and run tests.
  3. Start with a small project: It is a good idea to start with a small project when you are first getting started with TDD. This will allow you to learn the basics of TDD without feeling overwhelmed.
  4. Get feedback from others: Once you have started using TDD, it is a good idea to get feedback from others. This could include your team members, your manager, or even other developers who are using TDD.

Conclusion

TDD is a powerful tool that can help you to improve quality, reduce costs, and increase the productivity of your software development projects. If you are interested in getting started with TDD, there are a number of resources available to help you.

Stephen Adams 0 Comments
Apr 1 2023
Contractor Chronicles 4

This week I’ve spent working on a very tricky bug, not one that required a complex rewrite to solve, but instead one that was hard to find the cause of.
It was on a Angular app that uses a third party system to generate forms for the application. The issue was that where this third party system had been updated it required a change to one of the forms in the application.

It was tricky to solve due to the fact that it needed a lot of comparing files and lines and lines of JSON to find the issue. Thankfully another developer helped me see the issue and I had been looking at it for hours.

It does go to show that it is always a good idea to get a ‘second pair of eyes’ to look at an issue. There’s no shame in asking for help in the end it helps get the problem solved and the work can continue.

The current contract I have should be ending at the end of April, so I’m going to start looking for the next one soon. Changing contracts is always a interesting time, mainly it’s stressful looking for the next role, but it is also a time to think about maybe trying something different.

If I look around on the job boards and LinkedIn it looks like React is the main choice for building web apps. So when this contract is up it might be time to look at getting into React development.
Having said that, Angular is going through a bit of a change. It now has stand alone components, like React and Vue. It has a new system called Signal coming in the next version, which is a new way of adding Reactivity to your application. These two changes alone mean that Angular apps can soon be written using the same approach as React and Vue, but still have all that Angular provides a complete framework with many of the tools you need for an application (like built in testing, routing, an http client and the CLI).

So is it worth looking at React when Angular could be having a resurgence? I’m not sure. I think at the end this contract I’ll spend a few days building a React app to see what it’s like to work with.

Stephen Adams 0 Comments
Mar 31 2023
Business Benefits of TypeScript

TypeScript is a typed superset of JavaScript that compiles to plain JavaScript. It adds optional static typing to JavaScript, classes, interfaces, and other advanced features.

TypeScript has a number of benefits for businesses, including:

  • Increased productivity: TypeScript can help developers to write code more quickly and efficiently. This is because the compiler can help to identify errors early, and the IDE can provide auto-completion and other features that can help developers to write code faster.
  • Reduced costs: TypeScript can help to reduce costs by making it easier to refactor code. Refactoring is the process of changing the structure of code without changing its behaviour. With TypeScript, developers can refactor code with confidence, knowing that the compiler will help to ensure that the changes do not break the application.
  • Improved quality: TypeScript can help to improve the quality of software by making it easier to write unit tests. Unit tests are automated tests that can help developers to identify defects early in the development process.
  • Increased maintainability: TypeScript can help to increase maintainability by making code more readable and understandable. This is because the compiler can help to identify errors, and the IDE can provide auto-completion and other features that can help developers to write code more clearly.
  • Improved security: TypeScript can help to improve security by making it easier to write type-safe code. Type-safe code is code that is less likely to contain vulnerabilities.

How to Get Started with TypeScript

If you are interested in getting started with TypeScript, there are a few things you can do:

  1. Learn the basics of TypeScript: There are a number of resources available online and in books that can teach you the basics of TypeScript.
  2. Choose a TypeScript IDE: There are a number of TypeScript IDEs available, such as Visual Studio Code and IntelliJ IDEA. These IDEs can help you to write and run TypeScript code.
  3. Find a TypeScript community: There are a number of TypeScript communities available online, such as the TypeScript subreddit and the TypeScript Discord server. These communities can help you to get help and support when you are using TypeScript.

Conclusion

TypeScript is a powerful tool that can help you to improve the quality, reduce costs, and increase the maintainability of your software development projects. If you are interested in getting started with TypeScript, there are a number of resources available to help you.

Stephen Adams 0 Comments
Mar 27 2023
Contractor Chronicles 3

This week was spent working on the maintenance of an existing Angular application, which has been recently updated to Angular 15.

The upgrade was fairly easy, Angular and the Angular CLI make upgrading between versions so easy. It was something I missed when working with Vue. I know that the Vue CLI does have a way of upgrading, but with the Angular CLI being a bit more mature I find the upgrade process far more straightforward.

I also spent a bit of time watching a live Twitch stream of Josh Goldberg (he’s a full-time open-source developer, who specialises in Typescript), in this stream he was reviewing a pull request to a Typescript project Typescript-ESLint, which is a library for adding linting for Typescript to ESLint.

Linting is a way of checking for bad practices in your code, it is a set of rules for JavaScript. This Typescript-ESLint project adds rules for Typescript to ESLint.

As I mentioned in earlier Contractor Chronicles I said I was looking for an open-source Typescript project to get involved in and I started to look more and more into this Typescript ESLint project and get involved in the project.

So this week I spent a bit more time looking at this project and after watching the Twitch Stream of Josh’s I’m starting to understand how the project works and hopefully soon I can start contributing to the project.

Finally, I spent some time going through a plan for the rest of the year, breaking down some goals I have for the years into projects. Then using the PARA method to organise these projects and goals.

Stephen Adams 0 Comments
alphabets close up computer connection
Mar 23 2023
Why Use TypeScript?

TypeScript is a free and open-source programming language that was developed by Microsoft. It is a superset of JavaScript that enables developers to write cleaner and more maintainable code. In this blog post, we will discuss why it is beneficial to use TypeScript in your next project.

Improved Code Quality

One of the main advantages of TypeScript is that it provides a type system that enables you to catch errors and improve your code quality. By defining types for your variables, functions, and classes, you can catch errors during development time rather than runtime. This helps you to avoid common bugs, such as null or undefined errors and improves the overall reliability of your code.

Better Tooling

Another benefit of TypeScript is that it provides better tooling support than JavaScript. TypeScript has a rich set of features that enable you to write code faster and with fewer errors. For example, TypeScript provides code completion, which helps you to write code faster and with fewer errors. It also provides better error messages, which helps you to debug your code more easily.

Improved Maintainability

TypeScript makes it easier to maintain code over time. By providing a type system and better tooling support, TypeScript enables developers to write code that is easier to maintain and refactor. This is especially important when working on large projects with many developers. TypeScript’s type system enables developers to understand the codebase better and helps them to make changes more confidently.

In conclusion, TypeScript is a powerful programming language that provides many benefits over JavaScript. It offers improved code quality, better tooling support, and improved maintainability. If you are starting a new project or considering a migration, TypeScript is a great choice that will pay dividends in the long run.

Stephen Adams 0 Comments
typography historical blur bokeh
Mar 17 2023
Contractor Chronicles 2

This week, carried on with existing client work. Fixing bugs on a complex Angular application that has been worked on by a number of others developers over the years. So it’s always interesting to take something written by someone else, work out how it works and then fix issues without making more bugs. This is a whole topic on its own, which I might write about

Also spent time looking into TypeScript libraries with the aim to work on some open-source development as a way to improve my TypeScript. I’ve been looking at TypeScript-ESlint, the linting library for TypeScript, a great project run by Josh Goldberg Its aim is to add support for ESLint to your TypeScript code. It will check your code for issues and bad practices and warn you of these issues.

Another thing that happen was there was a new budget in the UK, nothing really helpful for small business owners like myself just more ways of taxing people and trying to encourage people who have retired back to work (if I had retired and was playing golf every day I don’t think I’d be keen to go back to work).

The plan for next week is, to continue exploring open-source TypeScript development, working on client work and preparing for the next tax year.

Stephen Adams 0 Comments
books on shelves
Feb 14 2023
The Anatomy of a Great Typescript Book

If I was to write a TypeScript book, I would aim it at web developers who have started using TS, but come from a JavaScript background and have now been put on a TS-based project.

I wouldn’t aim at a certain web framework like React, or Angular, but how a web developer can start to use all the more advanced features in TypeScript so they can write good, type-safe code for their application, no matter the framework they are using.

In this ‘book,’ I will cover briefly what TypeScript is and its aim. I think it is clear now what TypeScript is and what its original aim was, but if someone is coming to this ‘book’ without knowing anything about TS then a brief introduction is needed. Try to explain to someone who’d be asked or just started using TypeScript why it’s so good and why they should be using it over JavaScript.

I’d then move on to introduce Types, and the primitive types that you have in TS (string, number, boolean) then move on to how to define your Types and the various ways you can do this. How you can create Types from other Types, how to use the utility Types and build up the Types for your project. All the time I try to keep it framework agnostic but relate it to a web developer who is now working on a TS-based project for the first time. So they can see that there are primitive Types, but they aren’t all you have (not everything needs to be a string). How you can start to build your Types that are more descriptive and applicable to your application.

Then I’d start looking at classes and modules and how they can be used along with Types to create a common library that you can use within the components of the framework you are using whether it’s Angular, Vue or React. Building this library of domain-specific Types that describe the data of your application and how you can use classes and modules to structure this library.

After introducing this concept of building a library for your application, which is more domain-specific and provides the business logic your UI components need. I’d move on to using Generics and how they can improve the re-usability of this business logic library.

I found Generics in TypeScript a complex topic to understand, especially if you’ve come from something like JavaScript. They are a powerful concept to understand and to start making use of, when you do it takes the re-usability of your code to another level. I feel that as a web developer who has used a couple of UI frameworks, concepts like Generics and Type manipulation are features I know about but haven’t used much in my applications because so much is handled by the framework. If I learnt more about these advanced concepts of TypeScript they’d improve my code so much.

I would then start to finish the book by looking at the compiler, how it works, and how to make use of the TSConfig settings and compiler. Again through using UI frameworks a lot of the TS compiler settings are set up as part of the framework CLI tooling. Knowing more about this area can lead to more efficient code.

After all that I’d spend a little time looking at the various TypeScript libraries that are available which can be used along with the framework to improve Type safety and maintainability within an application. Libraries like ZOD and tRPC, for example.

Finally, I would then take this concept of learning to build an internal library of business logic for an application and go through how external libraries can be built that can be used to share business logic across multiple applications. If you are a web developer who works for an organisation who have more than an internal application that uses TypeScript and how using features like classes, modules and Generics a Type safe domain-based library can be built and used across all these applications.

I think the aim of this ‘book’ would be to show that, yes TypeScript is used by all the main web frameworks, but there is more to it than just writing the code behind your framework’s components. We learn a lot about frameworks but not so much about the language behind it

Stephen Adams 0 Comments