I have been working with Bootstrap for years and have not spent much time with Angular Material. So i created a simple todo app tonight.

Angular Material is a UI component library and design system for building user interfaces in Angular applications. It follows the Material Design principles established by Google, providing a set of pre-designed and customizable components that can be easily integrated into Angular projects. Angular Material helps developers create visually appealing and consistent UIs while adhering to best practices for design and user experience.

Key features and concepts of Angular Material include:

1. Component Library: Angular Material offers a comprehensive collection of reusable UI components, including buttons, cards, dialogs, menus, forms, tooltips, and more. These components are built using Angular and can be seamlessly integrated into your application.

2. Theming and Styling: Angular Material supports theming and provides a theming system that allows you to customize the appearance of components to match your application's branding and design. You can define color palettes, typography settings, and other styles.

3. Responsive Design: Angular Material components are designed to be responsive and work well across different screen sizes and devices. They adapt to the available space and provide consistent user experiences.

4. Accessibility: Angular Material places a strong emphasis on accessibility, ensuring that components are designed and developed with accessibility best practices in mind. This helps create inclusive and user-friendly interfaces.

5. Component Variants and Flexibility: Many components in Angular Material come with multiple variants and customization options, allowing you to tailor them to your specific use cases.

I have been toying with the idea of creating a simple extendable pagination service for angular using RxJs.

RxJS (Reactive Extensions for JavaScript) is a powerful library for reactive programming in JavaScript. It provides a set of tools and operators that enable developers to work with asynchronous and event-driven code in a more functional and declarative manner. RxJS is heavily based on the concept of Observables, which are streams of data that can be observed and manipulated over time.

Reactive programming, as facilitated by RxJS, allows you to work with data streams and events in a consistent and composable way, making it easier to handle complex asynchronous scenarios. It's particularly useful for scenarios like handling user input, managing AJAX requests, working with real-time data, and managing state changes in web applications.

Key concepts and features of RxJS include:

1. Observables: Observables represent sequences of data over time. They can emit values, errors, and completion signals. Observables can be subscribed to, and you can perform operations on them using various operators.

2. Operators: Operators are functions provided by RxJS that allow you to transform, filter, combine, and manipulate data streams. Operators enable you to compose complex asynchronous logic in a concise and readable manner.

3. Subscription: Subscribing to an Observable allows you to receive values and notifications emitted by the Observable. Subscriptions can be managed to control when data is consumed and to avoid memory leaks.

4. Subjects: Subjects are a type of Observable that allows you to both emit values and subscribe to them. They are often used for creating event emitters or managing state changes.

5. Schedulers: Schedulers provide a way to control the execution context and timing of Observables. They are useful for managing concurrency and handling asynchronous operations on different threads or environments.

Have you ever wanted to make a dropdown menu with multiple levels and a typeahead feature? I created this with ngx-bootstrap.

ngx-bootstrap is an open-source library that provides a set of native Angular directives and components that are built on top of the popular Bootstrap framework. It enables developers to easily integrate Bootstrap's CSS styling and interactive components into Angular applications using Angular-specific syntax and APIs.

The primary goal of ngx-bootstrap is to enhance the development experience for Angular developers by providing a seamless way to use Bootstrap components without the need for manual jQuery or JavaScript integration. This allows you to take advantage of Bootstrap's design and functionality while leveraging the power of Angular's component-based architecture.

Key features and benefits of ngx-bootstrap include:

Angular Directives and Components: ngx-bootstrap offers Angular-specific directives and components for common Bootstrap elements like modals, tooltips, carousels, date pickers, and more. These components can be used seamlessly in your Angular templates.

Bootstrap Styling: You can apply Bootstrap's CSS styling and responsive design to your Angular components without the need to manually include Bootstrap's JavaScript or jQuery dependencies.

Customization: ngx-bootstrap provides options for customizing the behavior and appearance of its components to match your application's design and branding.

Performance: By using Angular's native components and change detection, ngx-bootstrap can offer better performance and maintainability compared to traditional jQuery-based integrations.

Integration with Reactive Forms: Many ngx-bootstrap components are designed to work well with Angular's reactive forms, providing seamless integration with form controls and validation.

I created a BMI calculator to watch my weight. This is simple Javascript skinned with BootstrapJS

Bootstrap is an open-source front-end framework for building responsive and visually appealing web applications. It provides a collection of pre-designed HTML, CSS, and JavaScript components, as well as a responsive grid system, that streamline the process of designing and developing consistent and modern user interfaces.

The primary goals of Bootstrap are to:

Ease of Use: Bootstrap simplifies web development by offering a set of ready-to-use components and styles. Developers can quickly build and prototype web interfaces without having to start from scratch.

Responsive Design: Bootstrap's responsive grid system allows developers to create layouts that adapt to different screen sizes and devices, ensuring a consistent user experience across desktops, tablets, and mobile devices.

Consistency: By using Bootstrap's design and components, developers can achieve a consistent and cohesive look and feel throughout their web application, regardless of the team's design skills.

Customizability: While Bootstrap provides a default theme, it's highly customizable. Developers can easily modify colors, typography, and other design elements to match their branding.

Cross-Browser Compatibility: Bootstrap is designed to work across different web browsers, helping ensure that your application looks and functions consistently for users.

Key features and components of Bootstrap include:

Responsive Grid System: Bootstrap's grid system allows developers to create flexible and responsive layouts by organizing content into rows and columns.

Typography: Bootstrap provides a set of typography styles for headings, paragraphs, lists, and other text elements.

CSS and Components: Bootstrap offers a wide range of CSS classes and components for buttons, forms, navigation bars, modals, alerts, cards, and more.

I have been working I18n localization. It has caused me to need to generate large list of messages in JSON, YAML and Java properties. So I got creative and made this little app to generate them. I call it Message Writer.

I18n, short for "Internationalization," is the process of designing and developing software applications in a way that makes them adaptable and culturally relevant for users from different regions and languages. The goal of internationalization is to create software that can be easily localized for different languages, cultures, and regions without requiring significant changes to the underlying codebase.

Key concepts and practices related to internationalization (I18n) include:

Localization (L10n): Localization is the process of adapting an application or content to a specific locale or language. It involves translating user interface elements, text, dates, numbers, and other content to make the application culturally relevant to a target audience.

Unicode and Character Encoding: Unicode is a character encoding standard that represents characters from virtually all written languages in a consistent manner. It allows software to handle different scripts and languages without encoding conflicts.

Text Externalization: In internationalized applications, text strings and other user-visible content are externalized into resource files or databases, making it easier to replace and translate them for different languages.

Date and Time Formatting: Internationalized applications consider regional date and time formats, including different date orders, time zones, and localized date representations.

Number and Currency Formatting: Different cultures use varying formats for numbers, currencies, and decimal separators. Internationalized applications adjust these formats based on the user's locale.

I recently had the opportunity to develop a serverless application with the use of AWS Lambda and API Gateway. It was my first introduction to the technology. My coworker suggested the solution as a way to keep cost down for for hosting a relatively simple  REST API needed for multiple other services in our main application. We started with a Spring Boot Java application connected to DynamoDB in a docker container. Then we created a Lambda file to define the API endpoints. A Lambda file in this case is was a single Java class with methods for each endpoint which is basically the same thing as a traditional Spring Boot Controller. The Lambda file called an additional service file to do the core logic which also depended on a CRUD Repository file that integrates to DynamoDB. This Lambda project is deployed to AWS via a serverless.yml file that defines the paths and parameters for the Lambda file. The challenges I faced were mostly learning to use AWS API Gateway and serverless.yml. We used the original spring controller to debug during development. Once we got it working it seemed rather simple though. 

AWS Lambda is a serverless computing service provided by Amazon Web Services (AWS) that enables you to run code in response to events without the need to provision or manage servers. With AWS Lambda, you can build and deploy applications using a "pay-as-you-go" model, where you only pay for the compute time that your code actually consumes.

Key features and concepts of AWS Lambda include:

Serverless Architecture: With AWS Lambda, you don't need to worry about server provisioning, scaling, or maintenance. AWS takes care of the underlying infrastructure, allowing you to focus on writing and deploying code.

Event-Driven Execution: AWS Lambda functions are triggered by events from various AWS services or custom sources. These events can include changes in data, HTTP requests, database updates, file uploads, and more.

Well it was a long cold winter and I have been in deep with the JavaScript. Now that spring is here, I am booting up with some good old Java Rest because I would like to do some more backend development now. I've done backend work here and there through out my career, but really need to to do more Java. 

So I put together a simple REST API in Spring Boot with authentication that could be used to start any project. I like JWT personally over other methods I have used in the past. This simple api lets you register, login and create and edit post articles. I set it up with the database with Docker for easy installation.

In case you don't know, Spring Boot is an open-source Java-based framework that simplifies the process of building production-ready, stand-alone, and highly scalable web applications and microservices. It is a part of the broader Spring Framework ecosystem and aims to provide developers with a rapid development and deployment experience by offering a set of pre-configured defaults and conventions.

Key features and concepts of Spring Boot include:

Opinionated Defaults: Spring Boot comes with a collection of sensible defaults and pre-configured settings for common tasks, reducing the need for manual configuration. This allows developers to get started quickly without the need for extensive boilerplate code.

Auto-Configuration: Spring Boot employs auto-configuration to automatically configure application components based on the classpath and the dependencies present in the project. It simplifies the configuration process and reduces the need for explicit configuration.

Embedded Web Server: Spring Boot includes a choice of embedded web servers like Apache Tomcat, Jetty, and Undertow. This means that you can package your application as a standalone executable JAR or WAR file without needing to deploy it to a separate web server.

At work, I was faced with the challenge of upgrading an AngularJS app with heavy use of $compile to the latest version of Angular which has no out of the box solution for compiling a template string that includes other components. So after much research I developed this component. Of course, I forked the main concept from another developer's sample posted overstack (https://stackoverflow.com/a/53739133) and I added the context input. It was hard to find on the internet, so I hope that others will benefit from this code. Enjoy.
https://mx-bind-html-compile.stackblitz.io

Developing apps with Docker is pretty much the standard these days.

Docker is an open-source platform that enables developers to automate the deployment, scaling, and management of applications using containerization. Containers are lightweight, portable, and self-sufficient units that encapsulate an application and its dependencies, allowing it to run consistently across different environments, from development to production.

Let's write a Dockerfile to spin up a Node App in Ubuntu.

Have you ever wanted to create end to end tests for your app, but just can't find the time to get those tests working. Well, I have tried several frameworks from Cypress, to Selenium. I have always felt like this technology ought to be made simple. Just recently after taking another look at Selenium,

Selenium is an open-source software suite used for automating web browser interactions. It provides a way to simulate user actions and interactions with web applications, allowing developers and testers to automate various tasks, perform functional testing, and ensure the quality and correctness of web applications.

Key features and concepts of Selenium include:

Web Testing Automation: Selenium is primarily used for automating web testing scenarios. It can interact with web elements, fill out forms, click buttons, navigate pages, and validate expected behaviors.

Cross-Browser Compatibility: Selenium supports multiple web browsers, including Google Chrome, Mozilla Firefox, Microsoft Edge, Safari, and more. This allows you to test your web application's compatibility across different browsers.

Programming Language Support: Selenium supports several programming languages, including Java, Python, C#, Ruby, and JavaScript. This enables you to write tests in a language of your choice.

Web Element Locators: Selenium provides various methods for locating web elements on a page, such as by ID, name, XPath, CSS selectors, and more. These locators help identify elements for interaction.

Test Scripts: Selenium test scripts are written to simulate user actions and validate expected outcomes. Test scripts can be executed sequentially or in parallel, depending on your testing needs.

Selenium WebDriver: WebDriver is a component of Selenium that provides a programming interface for interacting with web browsers. It allows you to control browsers programmatically and perform actions like clicking, typing, and navigating.