From 263fd3e215d50e99e92507db28e476dd02f85dc4 Mon Sep 17 00:00:00 2001 From: mdvanes Date: Thu, 7 Dec 2023 08:29:17 +0000 Subject: [PATCH] =?UTF-8?q?Deploying=20to=20main=20from=20@=20code-star/co?= =?UTF-8?q?destar-website-next@08481971ab9ed7901dffe435c4110719a2a5eb98=20?= =?UTF-8?q?=F0=9F=9A=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- 404.html | 4 ++-- _next/data/I8DQk3SQ1bfjxyOfpYxwa/events.json | 1 + .../index.json | 2 +- _next/data/TnaEdhvUAqE4h18cinFPy/events.json | 1 - .../_buildManifest.js | 0 .../_ssgManifest.js | 0 .../static/css/{25fb650e40f0d4b9.css => 1dae025d113c10be.css} | 2 +- events.html | 2 +- index.html | 4 ++-- 9 files changed, 8 insertions(+), 8 deletions(-) create mode 100644 _next/data/I8DQk3SQ1bfjxyOfpYxwa/events.json rename _next/data/{TnaEdhvUAqE4h18cinFPy => I8DQk3SQ1bfjxyOfpYxwa}/index.json (74%) delete mode 100644 _next/data/TnaEdhvUAqE4h18cinFPy/events.json rename _next/static/{TnaEdhvUAqE4h18cinFPy => I8DQk3SQ1bfjxyOfpYxwa}/_buildManifest.js (100%) rename _next/static/{TnaEdhvUAqE4h18cinFPy => I8DQk3SQ1bfjxyOfpYxwa}/_ssgManifest.js (100%) rename _next/static/css/{25fb650e40f0d4b9.css => 1dae025d113c10be.css} (54%) diff --git a/404.html b/404.html index 4b5909c..03d3fa0 100644 --- a/404.html +++ b/404.html @@ -1,4 +1,4 @@ -404: This page could not be found

404

This page could not be found.

\ No newline at end of file + }

404

This page could not be found.

\ No newline at end of file diff --git a/_next/data/I8DQk3SQ1bfjxyOfpYxwa/events.json b/_next/data/I8DQk3SQ1bfjxyOfpYxwa/events.json new file mode 100644 index 0000000..3cd14e3 --- /dev/null +++ b/_next/data/I8DQk3SQ1bfjxyOfpYxwa/events.json @@ -0,0 +1 @@ +{"pageProps":{"pastMeetups":[{"created":1697454939000,"duration":14400000,"id":"296766473","name":"Workshop Red Hat Ansible Lightspeed and other Ansible development tools","date_in_series_pattern":false,"status":"past","time":1701351000000,"local_date":"2023-11-30","local_time":"14:30","rsvp_open_offset":"PT24H","updated":1701371524000,"utc_offset":3600000,"waitlist_count":0,"yes_rsvp_count":1,"is_online_event":false,"eventType":"PHYSICAL","group":{"created":1465915067000,"name":"Codestar Night","id":20072875,"join_mode":"open","lat":52.099998474121094,"lon":5.110000133514404,"urlname":"Codestar-Night","who":"Codestars","localized_location":"Utrecht, Netherlands","state":"","country":"nl","region":"en_US","timezone":"Europe/Amsterdam"},"link":"https://www.meetup.com/codestar-night/events/296766473/","description":"

You can sign up right now via this link: [https://www.ordina.com/insights/events/red-hat-openshift-workshop-2/](https://www.ordina.com/insights/events/red-hat-openshift-workshop-2/)

Recently Ansible Lightspeed has been introduced by Red Hat as an addition to existing developer tools in Ansible. Ansible Lightspeed (including IBM Watson Code Assistant) is a generative AI tool which makes it easier for developers to automate tasks in Ansible playbooks and create Ansible content. This session led by a Red Hat instructor is themed around \"A day in the life of an (Ansible) software developer\" and is focusing on tools that can help developers to create and improve Ansible playbooks in an efficient way.

**Agenda**

* 14:30 - 15:00: Registration
* 15:00 - 16:00: A day in the life of an Ansible developer
* 16:00 - 18:15: Labs
* 18:15- 18:30: Closure

**When** : November 30th 2023 van 15:00-19:00
**Where** : Ringwade 1, Nieuwegein
**Who** : Software developers, Cloud Engineers and DevOps Engineers
**What** : Bring your own laptop.

","visibility":"public","member_pay_fee":false,"featured_photo":{"id":516608243,"highres_link":"https://secure.meetupstatic.com/photos/event/2/0/3/3/highres_516608243.jpeg","photo_link":"https://secure.meetupstatic.com/photos/event/2/0/3/3/600_516608243.jpeg","thumb_link":"https://secure.meetupstatic.com/photos/event/2/0/3/3/thumb_516608243.jpeg","type":"event","base_url":"https://secure.meetupstatic.com"}},{"created":1698310263000,"duration":10800000,"id":"296966454","name":"Codesmiths Unite ","date_in_series_pattern":false,"status":"past","time":1700755200000,"local_date":"2023-11-23","local_time":"17:00","updated":1700771768000,"utc_offset":3600000,"waitlist_count":0,"yes_rsvp_count":8,"venue":{"id":26404459,"name":"Ringwade 1","lat":52.057823181152344,"lon":5.111423015594482,"repinned":true,"address_1":"Ringwade 1","city":"Nieuwegein","country":"nl","localized_country_name":"Netherlands"},"is_online_event":false,"eventType":"PHYSICAL","group":{"created":1465915067000,"name":"Codestar Night","id":20072875,"join_mode":"open","lat":52.099998474121094,"lon":5.110000133514404,"urlname":"Codestar-Night","who":"Codestars","localized_location":"Utrecht, Netherlands","state":"","country":"nl","region":"en_US","timezone":"Europe/Amsterdam"},"link":"https://www.meetup.com/codestar-night/events/296966454/","description":"

**Details**
Ordina Codesmiths stand for a shared passion in Software Engineering and knowledge sharing.
Join us on the 23rd of November and meet your peer developers and hear interesting learnings on topics as Cloud, Security, Frontend, Mobile and testing.

**Program:**
**Walk in 17:00**
**Buffet and drinks 17:15**
**Opening 18:00**
**Talk 1 18:10 - 18:35**
Frederieke Scheper - Kubernetes deployment done right
**Talk 2 18:40 - 19:05**
Rick Hutten - Simplifying Concurrency
**Break**
**Talk 3 19:20 - 19:45**
Kaya Weers - Design patterns
**Drinks 19:45**

**About the talks and presenters**

**Frederieke Scheper**
**Helm - Kubernetes deployments done right**
Instead of steering into the murky waters of unmaintainable copy-pasted Kubernetes YAML files, let’s take the Helm and let it manage all your Kubernetes deployments, from a simple Spring Boot microservice to the most complex Kubernetes application! In this presentation, I will show you how easy it is to create, version, share, and publish Helm Charts. So, start using Helm and stop the copy-and-pasting. Along the way, you will discover the real benefits that lay in the role it plays in streamlining your CI/CD pipelines. Helm automatically maintains a database of all the versions of your releases. So, whenever something goes wrong during deployment, rolling back to the previous version is just one command away. So, let’s take a deep dive into Helm charts, templates, and functions: Kubernetes deployments done right!

**Rick Hutten**
**Simplifying Concurrency with Project Loom: A Journey with Pizza-chef Fabio**
Project Loom, a groundbreaking feature within OpenJDK, introduces a lightweight and versatile concurrency model for Java. Understanding concurrency can be challenging, especially for non-technical individuals and novice developers. In this session, we embark on an adventure alongside Fabio, a passionate pizza-chef facing similar challenges in his upscale restaurant as those encountered in multithreading on a CPU. We delve into concepts such as CPU threads, virtual threads, and structured concurrency, making them accessible to listeners of all proficiency levels. Attendees will not only learn to recognize the use cases of these techniques but also gain insights into how and if Project Loom can enhance their application.

**Kaya Weers**
**A design pattern goes to the supermarket**
Everybody knows the term design patterns. Some know the patterns and correct implementation by heart. Others vaguely recognize the pattern names but don’t recall the details. This talk is intended for the latter group.
I’ll dive into a couple of design patterns using real-life examples. What would a design pattern look like in day-to-day life? We’ll follow Bobby and Billie and discover how a design pattern would behave in a non-digital environment: the supermarket! With the help of drawings, this talk will give you a solid understanding of design patterns, so you won't have to look them up ever again!

","visibility":"public","member_pay_fee":false,"featured_photo":{"id":516824538,"highres_link":"https://secure.meetupstatic.com/photos/event/a/d/f/a/highres_516824538.jpeg","photo_link":"https://secure.meetupstatic.com/photos/event/a/d/f/a/600_516824538.jpeg","thumb_link":"https://secure.meetupstatic.com/photos/event/a/d/f/a/thumb_516824538.jpeg","type":"event","base_url":"https://secure.meetupstatic.com"}},{"created":1698153898000,"duration":14400000,"id":"296928992","name":"Tech Women Connect","date_in_series_pattern":false,"status":"past","time":1700751600000,"local_date":"2023-11-23","local_time":"16:00","updated":1700771737000,"utc_offset":3600000,"waitlist_count":0,"yes_rsvp_count":17,"venue":{"id":24315864,"name":"Ordina HQ ","lat":52.05641174316406,"lon":5.110540866851807,"repinned":true,"address_1":"Ringwade 1","city":"Nieuwegein","country":"nl","localized_country_name":"Netherlands"},"is_online_event":false,"eventType":"PHYSICAL","group":{"created":1465915067000,"name":"Codestar Night","id":20072875,"join_mode":"open","lat":52.099998474121094,"lon":5.110000133514404,"urlname":"Codestar-Night","who":"Codestars","localized_location":"Utrecht, Netherlands","state":"","country":"nl","region":"en_US","timezone":"Europe/Amsterdam"},"link":"https://www.meetup.com/codestar-night/events/296928992/","description":"

On the 23*rd* of November we are organizing the Tech Women Connect event at the Ordina office in Utrecht(Nieuwegein), it’s an inspiring gathering that celebrates and empowers women in the tech industry.

In the last four decades, there has been increasingly more attention on the participation of women in male-dominated sectors, such as IT — another milestone to celebrate. However, women in male-dominated careers still face challenges today.
Modern day workforces are moving in the right direction, yet many women are not experiencing the benefits. So how can individual women continue and accelerate to thrive in male-dominated industries?
Perhaps the best approach is to ask individual women who have done it…

Here’s what you can look forward to:

**Valuable Insights:** *Gain priceless insights from accomplished women in tech. Learn from their experiences, achievements, and challenges, and discover how you can succeed and thrive in the tech industry.*
**Networking Opportunities:** *Connect with remarkable tech women, industry leaders, and like-minded professionals. Forge new connections, exchange ideas.*
**Exciting Games and Activities!**

**Event Details:**
Date: November 23, 2023
Time: 16:00 – 20:00
Venue: A12.06 AUDITORIUM, Ringwade 1, Nieuwegein

**Program Schedule:**

* **16:00 – 16:40: Keynote Speaker (Stacy Cashmore – “My Journey into Speaking”)** *Join us as we kick off the evening with an engaging keynote address from a prominent tech women who will share her remarkable journey into the world of public speaking. Get ready to be inspired by her insights and experiences.*
* **17:00 – 18:00: Panel Discussion – “Tech Women in a Male-Dominated Culture”** *Our panel of women tech experts will engage in a discussion on the challenges and triumphs of women working in male-dominated environments.*
* **18:00 – 18:30: Keynote Speaker (Kaya Weers – “The Non-Typical Dev”)** *Our second keynote speaker will dive into the world of not fitting in the stereotypes and the importance of feeling like you belong.*
* **19:00 onwards: Dinner and Networking** – *it’s time to relax, connect, and enjoy small drinks and some snacks (vegetarian options included).*

**Note:** we have limited seats for external attendees. Please confirm and sign up as soon as possible to secure your seat. Once you receive a confirmation from our side you will be a confirmed guest to the event..

**How to get there?**

**Public transport**
At Utrecht Centraal, take BUS 65/74/77 or Tram 60, both stop at Westraven, from there it’s a 5-10 min walk to the Ordina office.

**Car**
You have free parking outside the Ordina office (Ringwade 1, Nieuwegein)

","visibility":"public","member_pay_fee":false,"featured_photo":{"id":516794606,"highres_link":"https://secure.meetupstatic.com/photos/event/3/9/0/e/highres_516794606.jpeg","photo_link":"https://secure.meetupstatic.com/photos/event/3/9/0/e/600_516794606.jpeg","thumb_link":"https://secure.meetupstatic.com/photos/event/3/9/0/e/thumb_516794606.jpeg","type":"event","base_url":"https://secure.meetupstatic.com"}},{"created":1696248935000,"duration":10800000,"id":"296486807","name":"Ordina Frontend Community presents: Back to basics panel discussion","rsvp_limit":15,"date_in_series_pattern":false,"status":"past","time":1697729400000,"local_date":"2023-10-19","local_time":"17:30","rsvp_close_offset":"PT72H30M","updated":1697749352000,"utc_offset":7200000,"waitlist_count":0,"yes_rsvp_count":5,"venue":{"id":26404459,"name":"Ringwade 1","lat":52.057823181152344,"lon":5.111423015594482,"repinned":true,"address_1":"Ringwade 1","city":"Nieuwegein","country":"nl","localized_country_name":"Netherlands"},"is_online_event":false,"eventType":"PHYSICAL","group":{"created":1465915067000,"name":"Codestar Night","id":20072875,"join_mode":"open","lat":52.099998474121094,"lon":5.110000133514404,"urlname":"Codestar-Night","who":"Codestars","localized_location":"Utrecht, Netherlands","state":"","country":"nl","region":"en_US","timezone":"Europe/Amsterdam"},"link":"https://www.meetup.com/codestar-night/events/296486807/","description":"

**Back to basics panel discusison**
Ordina's Frontend Community would like to present to you an open and interactive discussion about the world of frontend. We'll talk about *\"How we've gotten here and where it is going\".*

Come and join us to have a chat about how complex the world of modern front end development has become, trends we see returning from the past and how this all affects our daily jobs as frontend developers.

Topics like:

* **Have our tools** been focussed too much on **Developer Experience**, instead of the **User**?
\\- What **benefits** do our **modern stacks** have, and **for who** are these benefits?

And more, we're **taking** your **suggestions**!

https://forms.office.com/e/dLK7MbgHm6

**Programme**
**17:30 Walk-in, dinner & drinks**
A diverse dinner will be served, any dietary preferences or restrictions can be mentioned in the signup form.

**18:45 Introductions of our panelists**
We'll move to the main venue room and open with a short introduction of our panelists and their diverse experiences.

**19:00 Panel discussion**
Kick off the panel discussion with some topics, suggested by **you**! Use the signup form to add your ideas/controversial topics or other suggestions to the discussion up front!

**20:00 Closing & Drinks**
After a good hour of chatting about a diverse range of prepared topics and questions, we'll close the main room. There'll be plenty of opportunity to continue any discussions or conversations with a drink and snack before we close the venue for the day.

This event will be cross posted on Meetup.com and internally to Ordina colleagues. Therefore there will be a stricter limit on amount of registrations for this specific event.

","how_to_find_us":"By bicycle: Plenty of parking room for bicycles at the front door.\nBy public transport: Tramlines 20 & 21 stop within a short walk's distance\nBy car: Free parking in front of the building","visibility":"public","member_pay_fee":false,"featured_photo":{"id":516309713,"highres_link":"https://secure.meetupstatic.com/photos/event/2/5/f/1/highres_516309713.jpeg","photo_link":"https://secure.meetupstatic.com/photos/event/2/5/f/1/600_516309713.jpeg","thumb_link":"https://secure.meetupstatic.com/photos/event/2/5/f/1/thumb_516309713.jpeg","type":"event","base_url":"https://secure.meetupstatic.com"}},{"created":1693462430000,"duration":14400000,"id":"295795991","name":"Creating UI libraries by utilizing Storybook, ReactJs, NPM and Azure.","date_in_series_pattern":false,"status":"past","time":1695913200000,"local_date":"2023-09-28","local_time":"17:00","updated":1695935924000,"utc_offset":7200000,"waitlist_count":0,"yes_rsvp_count":2,"venue":{"id":24315864,"name":"Ordina HQ ","lat":52.05641174316406,"lon":5.110540866851807,"repinned":true,"address_1":"Ringwade 1","city":"Nieuwegein","country":"nl","localized_country_name":"Netherlands"},"is_online_event":false,"eventType":"PHYSICAL","group":{"created":1465915067000,"name":"Codestar Night","id":20072875,"join_mode":"open","lat":52.099998474121094,"lon":5.110000133514404,"urlname":"Codestar-Night","who":"Codestars","localized_location":"Utrecht, Netherlands","state":"","country":"nl","region":"en_US","timezone":"Europe/Amsterdam"},"link":"https://www.meetup.com/codestar-night/events/295795991/","description":"

Sign up for this event here: [https://www.meetup.com/utrecht-frontend-meetup/events/295531915/](https://www.meetup.com/utrecht-frontend-meetup/events/295531915/)

If you have ever attempted to extract your UI libraries into an abstract package which can be consumed just like any other NPM package. You’ll probably have encountered quite a few hurdles. For example:

1. How do I build the code, do I use CJS or ESM?

2. How do I ensure code quality?

3. How do I actually publish an NPM package?

4. Can the publishing of packages be automated by CI/CD?

5. How do I provide interactive documentation like Bootstrap or Material UI?

If you have ever encountered or wondered about these questions this workshop is for you. We will set up a Storybook Application, unit test it, publish it via CI/CD, containerize it with Docker, publish our container to Azure Container Registry and finally publish the container to an Azure web app.

The workshop will be hosted on the 28*th* of September 17:00 - 21:00, food and drinks are included!

Pre-requisites: Some experience with JavaScript. Any CI/CD experience will help but is not necessary.

A github Repo will be available for reference.

","visibility":"public","member_pay_fee":false,"featured_photo":{"id":515525035,"highres_link":"https://secure.meetupstatic.com/photos/event/1/3/a/b/highres_515525035.jpeg","photo_link":"https://secure.meetupstatic.com/photos/event/1/3/a/b/600_515525035.jpeg","thumb_link":"https://secure.meetupstatic.com/photos/event/1/3/a/b/thumb_515525035.jpeg","type":"event","base_url":"https://secure.meetupstatic.com"}},{"created":1695301754000,"duration":21600000,"id":"296251627","name":"Workshop Red Hat OpenShift","date_in_series_pattern":false,"status":"past","time":1695812400000,"local_date":"2023-09-27","local_time":"13:00","updated":1695841163000,"utc_offset":7200000,"waitlist_count":0,"yes_rsvp_count":1,"venue":{"id":24315864,"name":"Ordina HQ ","lat":52.05641174316406,"lon":5.110540866851807,"repinned":false,"address_1":"Ringwade 1","city":"Nieuwegein","country":"nl","localized_country_name":"Netherlands"},"is_online_event":false,"eventType":"PHYSICAL","group":{"created":1465915067000,"name":"Codestar Night","id":20072875,"join_mode":"open","lat":52.099998474121094,"lon":5.110000133514404,"urlname":"Codestar-Night","who":"Codestars","localized_location":"Utrecht, Netherlands","state":"","country":"nl","region":"en_US","timezone":"Europe/Amsterdam"},"link":"https://www.meetup.com/codestar-night/events/296251627/","description":"

Free registration is open @ [https://www.ordina.com/insights/events/red-hat-openshift-workshop/](https://www.ordina.com/insights/events/red-hat-openshift-workshop/)
***Note that the registration process goes via the website above as we need to setup a lab environment specifically for you. Please keep in mind that with a no-show you're potentially taking someone else's spot.***
Participate in our journey into the world of cloud-native application development and deployment. Embrace the efficiency of cloud-native CI/CD pipelines with Openshift and learn how to streamline your application lifecycle management with OpenShift GitOps. With two dynamic workshops on 27 September led by an experienced Red Hat instructor focusing on OpenShift Pipelines and OpenShift GitOps, you can gain hands-on skills and insights that enable you to stay ahead in the rapidly evolving landscape of cloud-native technology.
**Program:**
**Walk in 14:30 - 15:00 hrs**
**Introduction Red Hat and OpenShift 15:00 - 16:00 hrs**
**Labs 16:00 - 18:30 hrs**

* *1- Introduction Openshift pipelines*

OpenShift Pipelines is a cloud-native, CI/CD delivery solution to build pipelines on OpenShift using Tekton.
* 2- *OpenShift GitOps*

Start using OpenShift GitOps and start deployments with Red Hat OpenShift GitOps (based on ArgoCD) and use Kustomize, sync waves, and hooks.

**Closure 18:30 - 19:00 hrs**
Don't miss this chance to elevate your technical expertise and reserve your spot now for our upcoming Red Hat OpenShift workshop on September 27th and get up to speed in the world of modern application development and operations.
***Don't forget to bring your own laptop!***

","visibility":"public","member_pay_fee":false},{"created":1681909979000,"duration":12600000,"id":"292995726","name":"AI Hackathon","date_in_series_pattern":false,"status":"past","time":1688052600000,"local_date":"2023-06-29","local_time":"17:30","updated":1688072986000,"utc_offset":7200000,"waitlist_count":0,"yes_rsvp_count":4,"venue":{"id":24315864,"name":"Ordina HQ ","lat":52.05641174316406,"lon":5.110540866851807,"repinned":true,"address_1":"Ringwade 1","city":"Nieuwegein","country":"nl","localized_country_name":"Netherlands"},"is_online_event":false,"eventType":"PHYSICAL","group":{"created":1465915067000,"name":"Codestar Night","id":20072875,"join_mode":"open","lat":52.099998474121094,"lon":5.110000133514404,"urlname":"Codestar-Night","who":"Codestars","localized_location":"Utrecht, Netherlands","state":"","country":"nl","region":"en_US","timezone":"Europe/Amsterdam"},"link":"https://www.meetup.com/codestar-night/events/292995726/","description":"

**AI Hackathon,** by Ordina's Frontend Guild
\"Attention developers and all AI enthusiasts! Are you looking for an exciting and spontaneous challenge that will put your coding skills to the test? Then join us for a ChatGPT hackathon where you'll have two hours to create a functional and practical application using ChatGPT's natural language processing capabilities. Whether you're a seasoned developer or new to AI, this is your chance to show off your skills and creativity in a fast-paced and dynamic environment. So come as you are and see what you can accomplish with ChatGPT by your side!.\"

**Program:**
**Walk in                        17:30 hrs**
**Grab some food and drinks    18:00 hrs**
Start Hackathon 18:15 hrs

","visibility":"public","member_pay_fee":false}]},"__N_SSG":true} \ No newline at end of file diff --git a/_next/data/TnaEdhvUAqE4h18cinFPy/index.json b/_next/data/I8DQk3SQ1bfjxyOfpYxwa/index.json similarity index 74% rename from _next/data/TnaEdhvUAqE4h18cinFPy/index.json rename to _next/data/I8DQk3SQ1bfjxyOfpYxwa/index.json index fa74b2f..84ee660 100644 --- a/_next/data/TnaEdhvUAqE4h18cinFPy/index.json +++ b/_next/data/I8DQk3SQ1bfjxyOfpYxwa/index.json @@ -1 +1 @@ -{"pageProps":{"publications":[{"id":"https://medium.com/p/cbf6741337d","title":"Micro Frontends in A Nutshell","author":"mdworld","latestPublishedAt":"Fri, 08 Apr 2022 06:56:06 GMT","uniqueSlug":"https://medium.com/codestar-blog/micro-frontends-in-a-nutshell-cbf6741337d?source=rss----ea5cff13e3c9---4","paragraphs":"

You may have heard of a Micro Frontends recently and felt it a bit difficult to grasp what exactly it is and if it is something you should get involved in. I’ll try to give a summary of the what, why, how, and when of the current state. To provide a high-over summary, I’ll also add some recommended reading if you would like to get more details.

Why use Micro Frontends?

Do you have a very large front-end code-base?

And by large, I’m talking about 50+ developers in a dozen of teams or more, probably cross-department, working on the same code-base in some manner. Do you have enterprise-scale continuous integration with e.g. GitLab, Bamboo running so many pipelines that the bottleneck is no longer a matter of adding more pods? Do you employ configuration managers or an Ops department to make sure deployments won’t affect each other too much? Do you have considerable codebases in incompatible front-end stacks, e.g. because of a migration from AngularJS to Angular >2?

Then chances are you need to use Micro Frontends. Or actually, you most probably are already using Micro Frontends.

What are Micro Frontends?

How is it possible you would not know you are using Micro Frontends? And why are we just now hearing so much about them? The truth is that although the term is relatively new it actually covers any range of solutions to integrate a collection of smaller frontends into one application.

Similar to Micro Service architectures, Micro Frontends facilitate large codebases by breaking them up into manageable pieces. This means:

The term is now popularized because of the advent of Module Federation in Webpack 5. Webpack 5 has been released towards the end of 2020, but this new major release is taking some time to be integrated in relevant tooling, e.g. Nx and Ng CLI.

Note that Micro Frontends (MFEs) are sometimes also referred to as Micro Apps.

How do you build Micro Frontends?

Since Micro Frontends as a concept are not new, some solutions that can be classified as Micro Frontends are ancient, considering the speed of development in the frontend ecosystem. Here are some of them, to give an idea of how broad Micro Frontends can be interpreted:

I won’t go into all the details about the pros and cons of each of these solutions. Instead I refer you to the recommended reading list below.

Note that solutions can be combined: you can have a deployment monolith (that expects components that are all using the same stack) but wrap components in Web Components to provide an abstraction layer and use different stacks to produce the Web Components. Additionally, you can use Web Components in combination with Module Federation for instance if you are migrating towards Module Federation as a Micro Frontends solution. Consider this schematic representation of a web application:

\"\"
Schematic representation of a web application

This could be implemented with different platforms like Angular and React by wrapping them in Web Components:

\"\"
Web Components diagram

Module Federation is the newest solution and many libraries are still adapting to it. Last year, Nx 12 released with support for Webpack 5 and Module Federation. See a real working example here https://code-star.github.io/nx-reference-shell/ or its source in https://github.com/code-star/nx-reference.

Because Micro Frontends break up a codebase into smaller, more manageable fragments, they are often mentioned in combination with Monorepo solutions like Nx or yarn/npm workspaces. However, it is perfectly possible to implement Micro Frontends without monorepos!

When to use Micro Frontends?

New technology inspires developers to experiment, but Micro Frontends and with that Module Federation are not worth the upkeep for small to medium applications. All-in solutions like Next or Gatsby are great fits for smaller applications and custom Angular applications, when well organized, scale very well up to enterprise level.

However, no framework inherently supports older versions of itself. So if a big bang migration from AngularJS to Angular or any other framework for that matter, you’ll end up with some kind of Micro Frontends solution. Plenty of enterprise codebases currently use some combination of hyperlinks and deployment monoliths.

This could look like a bank that offers a set of public pages (e.g. the general home page, and the landing pages of its departments) referencing each other with hyperlinks and a protected monolith app with many components (e.g. checking account, subscriptions to bank products, investments on one page).

\"\"
Hyperlinks and Monolith diagram

Exploring Module Federation can be worth it if continuous integration is slowed down too much because of the large amounts of tests and compilation of all the involved components. But note that there are other approaches, such as using Nx monorepos with properly set up hierarchy and running only affected tests.

Another reason to use Module Federation can be the need to support multiple frameworks. Compared to Web Components, Module Federation improves the runtime isolation of components while simultaneously reducing isolation of shared dependencies to reduce the overall footprint of the application.

Compare to the diagram for the earlier example using macro Web Components, you can see that lodash, Angular and React are only loaded once, despite being used by multiple isolated components:

\"\"
Module Federation diagram

Want to know more?

If you want to know more about Micro Frontends, Module Federation or Monorepos, you can contact met at @mdworldNL on Twitter or mail codestar@ordina.nl. We have experience with enterprise frontend at all the major banks and many governmental departments in the Netherlands.

When you want more background information as a developer, you can also read the articles provided below.

Recommended in-depth reading

Angular Architects:

By my colleague Peter Eijgermans:

This article was originally published at https://mdworld.nl/micro-frontends-in-a-nutshell

\"\"

Micro Frontends in A Nutshell was originally published in Codestar blog on Medium, where people are continuing the conversation by highlighting and responding to this story.

"},{"id":"https://medium.com/p/befc396d6dc5","title":"Tika NERding: Getting started using Named-Entity Recognition with OpenNLP on the JVM (Scala, Java…","author":"Nathan Perdijk","latestPublishedAt":"Fri, 06 Nov 2020 15:14:42 GMT","uniqueSlug":"https://medium.com/codestar-blog/tika-nerding-getting-started-using-named-entity-recognition-with-opennlp-on-the-jvm-scala-java-befc396d6dc5?source=rss----ea5cff13e3c9---4","paragraphs":"

Tika NERding: Getting started using Named-Entity Recognition with OpenNLP on the JVM (Scala, Java, Kotlin…)

For DataScience!

Some things are hard, some things are not… Turns out that doing NER (Named-Entity Recognition) on the JVM is… not! (Wait, that sounds familiar…)

\"\"

NER is the automated process of annotating words and phrases in sentences with relevant entity information, such as marking a word as a Person, or a Location. This can come in quite handy when doing automated text analysis and is a staple in the DataScience community. As the trouble with DataScience is often getting it into production, it is extremely handy that this technique can be directly used from JVM-languages. Now we can embed this technology in production ready applications built in Java, Scala, Kotlin...

First things first, the dependencies. These are all the dependencies from the .pom.xml file used for this example project:

Yes, that’s it.

For doing NER on String this is really all we need, but Apache Tika can also extract text from PDFs or even perform OCR, but you’ll need additional dependencies.

Then we need to download the models that we want to use and place them in our resources folder. You can download suitable OpenNLP models from http://opennlp.sourceforge.net/models-1.5/. These are conveniently wrapped in .bin format and should NOT be unpacked.

For this example, we will be using English language Models that can recognise Date, Location, Organization and Person, but there are also models available in other languages. Every model you want to use, you’ll need to add to a Java Map (or you can use SystemProperties for Tika to “discover”, but that’s a method I don’t like very much):

Now models contains four models, so let’s feed them to Tika:

Alright, now all we need is to feed a String of text to the nerRecogniser:

And now you can just go about using the results. Tika will return a Map, containing a key for each model that has managed to find matching results, and with each key there’s a value containing those results. In order to improve the prints, I’ve done a bit of tinkering as it is now DEMO time.

I’m using the contents of the Wikipedia article on the Peace of Utrecht.

For the first paragraph, this is my input text:

\"The Peace of Utrecht is a series of peace treaties signed by the belligerents in the War of the Spanish Succession, in the Dutch city of Utrecht between April 1713 and February 1715. The war involved three contenders for the vacant throne of Spain, and involved much of Europe for over a decade. The main action saw France as the defender of Spain against a multinational coalition. The war was very expensive and bloody and finally stalemated. Essentially, the treaties allowed Philip V (grandson of King Louis XIV of France) to keep the Spanish throne in return for permanently renouncing his claim to the French throne, along with other necessary guarantees that would ensure that France and Spain should not merge, thus preserving the balance of power in Europe.\\n\\nThe treaties between several European states, including Spain, Great Britain, France, Portugal, Savoy and the Dutch Republic, helped end the war. The treaties were concluded between the representatives of Louis XIV of France and of his grandson Philip on one hand, and representatives of Anne of Great Britain, Victor Amadeus II of Sardinia, John V of Portugal and the United Provinces of the Netherlands on the other. Though the king of France ensured the Spanish crown for his dynasty, the treaties marked the end of French ambitions of hegemony in Europe expressed in the continuous wars of Louis XIV, and paved the way to the European system based on the balance of power.[1] British historian G. M. Trevelyan argues:\\n\\nThat Treaty, which ushered in the stable and characteristic period of Eighteenth-Century civilization, marked the end of danger to Europe from the old French monarchy, and it marked a change of no less significance to the world at large, — the maritime, commercial and financial supremacy of Great Britain.[2]\\n\\nAnother enduring result was the creation of the Spanish Bourbon Dynasty, still reigning over Spain up to the present while the original House of Bourbon has long since been dethroned in France.\"

And these are the results from Tika NER:

Locations: Britain, Milan, Nova Scotia, Cape Breton, Italy, France, Africa, Sicily, North Sea, North America, Amazon, Spain, Rastatt, Portugal, Sacramento, North
Organisations: Article XIII, Spain
Persons: Philip V, Philippe, Philip, Louis XIV's, Louis XV, Charles VI., Oyapock, Saint Kitts
Date: 1713, 1720, 1713., 1712, 1714

And a second example, the second part of the article:

\"The War of the Spanish Succession was occasioned by the failure of the Habsburg king, Charles II of Spain, to produce an heir. Dispute followed the death of Charles II in 1700, and fourteen years of war were the result.\\n\\nFrance and Great Britain had come to terms in October 1711, when the preliminaries of peace had been signed in London. The preliminaries were based on a tacit acceptance of the partition of Spain's European possessions. Following this, the Congress of Utrecht opened on 29 January 1712, with the British representatives being John Robinson, Bishop of Bristol, and Thomas Wentworth, Lord Strafford.[3] Reluctantly the United Provinces accepted the preliminaries and sent representatives, but Emperor Charles VI refused to do so until he was assured that the preliminaries were not binding. This assurance was given, and so in February the Imperial representatives made their appearance. As Philip was not yet recognized as its king, Spain did not at first send plenipotentiaries, but the Duke of Savoy sent one, and the Kingdom of Portugal was represented by Luís da Cunha. One of the first questions discussed was the nature of the guarantees to be given by France and Spain that their crowns would be kept separate, and little progress was made until 10 July 1712, when Philip signed a renunciation.[4]\\n\\nWith Great Britain, France and Spain having agreed to a \\\"suspension of arms\\\" (armistice) covering Spain on 19 August in Paris, the pace of negotiation quickened. The first treaty signed at Utrecht was the truce between France and Portugal on 7 November, followed by the truce between France and Savoy on 14 March 1714. That same day, Spain, Great Britain, France and the Empire agreed to the evacuation of Catalonia and an armistice in Italy. The main treaties of peace followed on 11 April 1713. These were five separate treaties between France and Great Britain, the Netherlands, Savoy, Prussia and Portugal. Spain under Philip V signed separate peace treaties with Savoy and Great Britain at Utrecht on 13 July. Negotiations at Utrecht dragged on into the next year, for the peace treaty between Spain and the Netherlands was only signed on 26 June 1714 and that between Spain and Portugal on 6 February 1715.[5]\\n\\nSeveral other treaties came out of the congress of Utrecht. France signed treaties of commerce and navigation with Great Britain and the Netherlands (11 April 1713). Great Britain signed a like treaty with Spain (9 December 1713).[5]\"

And the results:

Locations: 1715.[16], Britain, Spanish Netherlands, Austrian Netherlands, France
Organisations: Oxford, House of, United Provinces, Dutch, Austro-Dutch Barrier Treaty, Harley, Duke, Earl, Allied
Persons: Robert Harley, William III, Earl
Date: 1710, 1709., May 1711), 1706

As you can see, not everything is found, or classified correctly, but it provides a good starting point for further text analysis and it took very little effort to get this working at all! Named-Entity Recognition is a tricky technique, so you may need to preprocess your texts a bit before you get good analysis results for your particular data set, but it’s definitely not difficult to get started.

You can download suitable OpenNLP models from http://opennlp.sourceforge.net/models-1.5/.

Check out the Apache Tika documentation to see what other great functionality is available.

If you want to take a closer look at this example, you can check it out from Github: https://github.com/NRBPerdijk/examplenertikascala/

Last but not least, kudos to the Apache Software Foundation for their continuing work towards great Open Source solutions.

\"\"
\"\"

Tika NERding: Getting started using Named-Entity Recognition with OpenNLP on the JVM (Scala, Java… was originally published in Codestar blog on Medium, where people are continuing the conversation by highlighting and responding to this story.

"},{"id":"https://medium.com/p/f5d2bfe9b397","title":"Tika Tika! Getting started doing OCR with Apache Tika andTesseract from the JVM","author":"Nathan Perdijk","latestPublishedAt":"Fri, 10 Apr 2020 15:29:03 GMT","uniqueSlug":"https://medium.com/codestar-blog/tika-tika-getting-started-doing-ocr-with-apache-tika-andtesseract-from-the-jvm-f5d2bfe9b397?source=rss----ea5cff13e3c9---4","paragraphs":"

Tika Tika! Getting started doing OCR with Apache Tika andTesseract from the JVM (Scala, Java, Kotlin…).

I can do DataScience, mate!

Some things are hard. Some things are not… Turns out that using OCR (Object Character Recognition) using Tesseract from the JVM is… not hard!

\"\"

The trickiest part, really, is setting up Tesseract on the machine you want to do your OCR on. Once you have managed to do that, you can just use the following Scala examples to use Apache Tika to do OCR in your own JVM project.

First things first. Taking care of your dependencies…

Add these to your pom.xml or other build tool equivalent:

Then, we need to properly configure a Tika Parser

We need one in order to do actually do any parsing. Because this kind of configuration tends to be ugly, I have put it all inside its own object/class to keep it separate from the rest of the code:

Finally, we have to create…

The code that provides the file to be OCRed.

We just turn the file we want to OCR into an InputStream and hand that off to the TikaOCRParser we specified above for parsing. Because using InputStreams and doing parsing are two IO processes that can (definitely) throw Exceptions, I have delegated the handling of the InputStream using Scala’s Using functionality, which will automatically wrap the whole operation into a Try while also making sure that the InputStream is closed when everything is done, even when exceptions are thrown. If the result is a Success, I convert it into a regular String, which can then be printed, or otherwise used at your convenience.

(The example file is a jpeg, but lots of different image formats, as well as PDF, are supported. Some, like JPEG2000, might require extra supporting software to be installed on the machine.)

So, that’s it. Pretty easy, right? Check out the Apache Tika documentation to see what other great functionality is available. Tesseract OCR is a pretty tricky field in and off itself, so be sure to check out all the tweaks you may have to make for your particular dataset. If you want to see the full code for this example, you can check it out on GitHub. Last but not least, kudos to the Apache Software Foundation for their continuing work towards great Open Source solutions.

Edit: I also wrote a short intro using Apache Tika to do Named-Entity Recognition (NER): Tika NERding: Getting started using Named-Entity Recognition with OpenNLP on the JVM

\"\"
\"\"

Tika Tika! Getting started doing OCR with Apache Tika andTesseract from the JVM was originally published in Codestar blog on Medium, where people are continuing the conversation by highlighting and responding to this story.

"},{"id":"https://medium.com/p/65158c284034","title":"Upgrading to Angular 9: My experience","author":"Bjorn ‘Bjeaurn’","latestPublishedAt":"Fri, 14 Feb 2020 12:32:47 GMT","uniqueSlug":"https://medium.com/codestar-blog/upgrading-to-angular-9-my-experience-65158c284034?source=rss----ea5cff13e3c9---4","paragraphs":""},{"id":"https://medium.com/p/2aeff1303749","title":"Leibniz equality in TypeScript","author":"Werner de Groot","latestPublishedAt":"Tue, 25 Jun 2019 16:21:37 GMT","uniqueSlug":"https://medium.com/codestar-blog/leibniz-equality-in-typescript-2aeff1303749?source=rss----ea5cff13e3c9---4","paragraphs":"

In this post I’ll explain how you can use Leibniz equality to safely type your higher-order components in React, although it can be used in many other places (outside the React ecosystem) too.

Introduction

At the client I’m currently working for we use a lot of different charts to visualize processes over time. We have line charts, Gantt charts, you name it. Each of those charts features buttons which allows users to zoom in or out.

I’d like to use a simplified version of one of those graphs to explain what Leibniz, a German mathematician who lived well over 300 years ago, has to do with TypeScript.

Motivating example

Let’s suppose our graph looks a bit like this:

\"\"

I use a component Graph which takes the following props:

What do we need to show a graph? We need:

Zooming in and out

In this aside, I’d like to show you the function that handles zooming in or out. It’s not really relevant to the rest of the story (and you can skip this if you like) but it might come in handy if you wish to code along with this blog post.

Higher-order component

Although it is tempting to let this component manage its own dayStart and dayEnd (especially now that we can use hooks), it has two benefits to manage that state externally:

If I would create a higher-order component (HOC) to manage that state for me, I would get the best of both worlds. I get an easy to use component which manages its own state if I wrap Graph in this HOC, but I get a lot of power if I choose not to.

Furthermore, I can apply this HOC to many other components which have a time axis and support some form of zooming in and out.

What should this HOC look like? What is the input? And what is the output?

The HOC we will write will provide the following props to the inner component (which we’ll call Inner in what follows):

It will produce a component (which we’ll call Outer from now on) that takes the following props¹:

This might be a bit intimidating. What this says is that we can determine the props to the outer component (OuterProps) from the props to the inner component (InnerProps) by removing all values that are shared with TimeAxisProps (dayStart, dayEnd, onZoomIn and onZoomOut to be precise)².

Now that we know what the HOC should do, we can focus on how it should do it:

That’s a big piece of code! We can see how to handle zooming in and zooming out. We can also see how we can combine both the OuterProps and the TimeAxisProps to render the Inner-component. You might also have noticed that InnerProps extends TimeAxisProps. Constraining our generic type parameter it this way ensures that we can only apply this HOC on components that have at least the props dayStart, dayEnd, onZoomIn and onZoomOut that we’d like to provide to it. If that component doesn’t have these four props, why even apply WithTimeAxis, right?

Trouble

There is, however, a tiny problem… It doesn’t compile!

\"\"

But why doesn’t it? TypeScript has trouble figuring out that the combination of OuterProps and TimeAxisProps is equal to InnerProps. Although this is true for the case with GraphProps, it isn’t true in general.

To give you an example in which this isn’t true, let’s suppose that we try to apply the HOC to a component CounterExample with the following props:

where I’d like to point your attention to the dayStart: 0.

I admit, this is a bit farfetched, but it does illustrate the point. We shouldn’t apply WithTimeAxis to CounterExample as the HOC might provide a dayStart that is not equal to zero. In fact, changing the zoom level multiple times ensures that dayStart will eventually be non-zero, even if it was equal to zero initially.

The TypeScript isn’t complaining about this when we do try to apply WithTimeAxis to CounterExample, as CounterExampleProps nicely extends TimeAxisProps as I required. CounterExampleProps is more specific than TimeAxisProps (because the type 0 is more specific than number) but that is allowed for subtypes. Instead, the compiler has noticed this possibility even before we did, and that is why our HOC doesn’t compile!

The root of our issues is with the InnerProps extends TimeAxisProps constraint. What we try to express is that all properties of TimeAxisProps are shared with InnerProps without allowing for subtypes. Unfortunately extends is currently the best we can do. In fact, it’s the only type of constraint we can express on our generic type parameters in TypeScript.

Hope on the horizon

We can solve this problem by pushing the burden of proof up a level. We ask the user for a function convert that is able to convert the combination of OuterProps and TimeAxisProps (which can be expressed in TypeScript as OuterProps & TimeAxisProps) to InnerProps. If the user can do that, we can call Inner with the right props:

What does this conversion function look like in the example of GraphProps? It’s not very difficult at all! In the example of GraphProps we can see that:

What it boils down to is that we are asked to provide a function that makes this very trivial conversion:

We can even use the identity function if we’d like:

For CounterExample we are asked to provide a conversion function that takes an object with dayStart: number to dayStart: 0. We could simply provide a conversion function that maps every dayStart (whether it is 1, 2, 99 or something else) to 0 but that would clearly not be in the spirit of WithTimeAxis. If I would instead try to use something identity in this case, TypeScript would complain.

\"\"

which is a rather nice way of hearing about this compilation error I think. (Especially the note at the bottom that says “Type ‘number’ is not assignable to type ‘0’” points you in the right direction immediately.)

As we’ve concluded earlier, OuterProps & TimeAxisProps is not equal to CounterExampleProps, and the compiler can tell you that. If you cannot use something like identity or trivial, that means you probably shouldn’t use this HOC.

This is really the crucial step of this blog, so take some time to digest this. We’ve pushed the burden of proving that OuterProps & TimeAxisProps to InnerProps from Outer (where that’s hard or even impossible to do) to the consumers of this component (where that is easy or even trivial to do). We can’t prove this in general, but we can do it case-by-case every time we apply WithTimeAxis.

Leibnizian equality

A famous mathematician called Leibniz described a form of equality in which two things (a and b) can be considered to be equal if every predicate that holds for a also holds for b (and vice versa).

In TypeScript, we can express this as

Two types A and B are equal if every function that maps A to B is also a mapping from B to A. You can see that it’s only possible to construct such a function if A is equal to B. In that case Leibniz collapses to type Leibniz = (a: A) => A (in other words, it is our identity function).

Leibniz is a formalization of the technique we used in the previous section with a HOC:

By requiring a Leibniz & TimeAxisProps, InnerProps> this function expresses that it can only do its job if OuterProps & TimeAxisProps and InnerProps are equal.

Because Leibniz<...> serves as our type constraint, we can even drop the extends from InnerProps extends TimeAxisProps. This is no real loss as that extends wasn’t doing a very good job anyways.

Conclusion

Sometimes we need something stricter than extends, or we’d like to constrict the type parameter in the other direction (number extends T instead of T extends number). In those cases Leibniz<...> can be your friend. In my experience using a Leibniz<...> improves the readability of your type constraints when those constraints get more complicated (or include three or more different types).

Afterthoughts

This technique was first used in Typing Dynamic Typing (Baars and Swierstra, ICFP 2002) but I haven’t seen it used in TypeScript anywhere yet. I’m really interested to hear how you would tackle the problem addressed in this post without using a Leibniz<...> or if you’ve seen it used in similar (or different!) places. Let me know!

[1]: Omit will be introduced in TypeScript 3.5. In the meantime, you can define it yourself as type Omit = Pick> .

[2]: We’ve defined OuterProps in terms of InnerProps. Like in mathematics, where you can express y in terms of x (y = 2x) or x in terms of y (x = y / 2), TypeScript allows me to reverse this relationship. We get

No need for complicated tricks like Omit<...>. Unfortunately, this doesn’t work. Because we start out with an Inner-component, from which we generate an Outer-component, we should start out with an InnerProps, from which we derive the OuterProps. If we would reverse this relationship by writing

we’d lose the ability for TypeScript to correctly infer the right types:

\"\"

In our example, the compiler would infer OuterProps to be equal to GraphProps, which includes dayStart, dayEnd, onZoomIn and onZoomOut so when you try to use the resulting component you are still asked to provide those props (even though they will by overwritten by the ones the HOC provides).

If you don’t mind helping the compiler a hand by providing the type yourself (instead of letting TypeScript infer it) then this is a very nice way of writing HOC’s and you needn’t read the rest of the blog.

\"\"

Leibniz equality in TypeScript was originally published in Codestar blog on Medium, where people are continuing the conversation by highlighting and responding to this story.

"},{"id":"https://medium.com/p/6a3f4b167852","title":"Event sourcing with Akka Persistence","author":"Nick ten Veen","latestPublishedAt":"Fri, 07 Jun 2019 12:40:24 GMT","uniqueSlug":"https://medium.com/codestar-blog/event-sourcing-with-akka-persistence-6a3f4b167852?source=rss----ea5cff13e3c9---4","paragraphs":"

Asynchronous pains

In one of our projects at the Port of Rotterdam we do a lot of stream processing where we require intermediate state. We are using Event Sourcing with Akka Persistence. It allows us to create robust stateful streaming applications that can maintain state between application restarts. We were struggling a bit writing our command handlers since we do a bunch of asynchronous operations. Akka Persistence does not allow you to handle command asynchronously which means you need to deal with this yourself. Let us explore the problem in a simplified event sourcing application.

Event Sourcing

Let us create a simple implementation of an event sourcing system. A simple calculator that can add and subtract values. First we define our state, which is simply an integer value:

The state can only be modified by firing events. Let us create two possible operations, adding and subtracting from the state:

Now that we have a definition for our state and possible events, we can write a handler that will process these events:

We can test the event handler to verify that the events are processed correctly:

Commands

In event sourcing, events are immutable facts that happened. These events should be handled deterministically without any side effect. However, sometimes we need to perform side effects. For example when we need to query a database to check if an operation is allowed. We can use the command abstraction for this purpose. A command is a request to do something. Requests can be accepted or denied, or even transformed. They are also allowed to perform side effects. We can define commands for addition and subtraction:

A command handler can process these commands and decide to fire zero or more events:

We can test the command handler to verify it will fire events accordingly:

The command handler and event handler can be folded together to calculate the state for a given list of commands:

This all works fine, but if we want to recover the state during a crash or restart, we also need to store the events that we persist. We need a function that accumulates the events while calculating the state:

We can keep the accumulated state in memory during processing and at the same time persist the generated events somewhere. On restarts we can replay these events with the eventHandler to restore our state.

Akka Persistence

This pattern is encoded in Akka Persistence and allows us to have actors with state that can be recovered after crashes and restarts. The command handler is a little bit different. Instead of returning a list of events that happened, you can specify an Effect. These effects are simply an encoding of possible actions a persistent actor can do after receiving a command:

These effects can be composed together to (for example) persist multiple events. In our example we can write a simple command handler:

Asynchronous command handling

One issue about the commandHandler is that it is synchronous. There are currently no plans for aynchronous command handlers in akka persistence.
If you want to do some asynchronous processing before deciding to persist an event, you need to introduce extra commands. For example, lets say we want to have a check if a specific addition or subtraction is allowed before we emit an event. We really need to do this asynchronously for some reason, so lets create a definition of our permission check:

To be able to add this to our command handler, we need an extra command that is fired after validation. We also group our previous commands into a subtype so it can be a parameter of our new command:

With this definition we can rewrite our event handler to take this check into account:

This does work, however we lost a property that might be important to us.
The order in which the algebraic commands are processed is lost due to the asynchronous boundary. Say our check is really slow for some specific elements. Other elements that arrived later might have been processed already and arrive out of order:

If we would process the following commands in order, the outcome might have a different order:

You could fix this by storing inflight messages in some (non-persistent) state,
or by using the ask pattern and waiting for replies before sending each command. Currently (as far as I am aware) you are unable to store volatile state in a persistent actor. This means that if you want to store messages that are in flight, you need to use persistence for this. We can extend the state to store this along with a persistent event to signal inflight messages:

Previously we only fired a command if an operation is allowed, but since we also need to unstash if an operation is not allowed, we always need to fire a command for a result. So we need to modify our OperationAllowed command:

Our event handler is now responsible for handling this extra event and cleaning up after a command has been successfully processed:

Finally we need to rewrite our command handler to stash incoming commands as long as there is still a message in flight.
After a command is successfully processed, we need to unstash to continue processing potentially stashed commands:

After all this there are still a few concerns with this implementation.
What if checkPermission fails? We would need to extend the example to deal with failing futures as well. Moreover, we persist the state of inflight messages so it survives restarts. However after a restart this message is not in flight and we might wait for eternity for it to resolve. This example illustrates that you can handle commands asynchronously, but in order to ensure messages are processed in the correct order, we needed to add error-prone synchronisation code.

Conclusion

You can do asynchronous command handling with Akka Persistence. It does however require you to write some error-prone boilerplate code. Can we do better? Are persistent actors the correct approach for this problem? Maybe we can express the problem in a different paradigm where we still have the nice property of state recovery, while also allowing us to handle commands asynchronously. Maybe we could use stream processing to have a cleaner solution to our problem. But that is for another blog post.

\"\"

Event sourcing with Akka Persistence was originally published in Codestar blog on Medium, where people are continuing the conversation by highlighting and responding to this story.

"},{"id":"https://medium.com/p/9790212aa211","title":"How we automated our Angular updates","author":"Bjorn ‘Bjeaurn’","latestPublishedAt":"Tue, 21 May 2019 13:37:13 GMT","uniqueSlug":"https://medium.com/codestar-blog/how-we-automated-our-angular-updates-9790212aa211?source=rss----ea5cff13e3c9---4","paragraphs":""},{"id":"https://medium.com/p/f81434f6f8d7","title":"Apollo Client in Practice","author":"mdworld","latestPublishedAt":"Thu, 02 May 2019 18:24:29 GMT","uniqueSlug":"https://medium.com/codestar-blog/apollo-client-in-practice-f81434f6f8d7?source=rss----ea5cff13e3c9---4","paragraphs":"

Some time ago I joined a team that is working on a search application. The application takes search terms and displays the results in a table with potentially dozens of columns and hundreds of rows, even before pagination. It is implemented in React and uses Apollo for GraphQL calls. I was surprised to find it noticeably slow when a lot of search results were retrieved. React is well-known for leveraging virtual DOM to optimize performance and GraphQL should even be able to add caching to further optimize performance on the side of network requests.

Looking into the performance tab of Chrome dev tools lead me to believe the performance problems were caused by computations in the bottom components (e.g. formatting in cells). Because there are so many and they are re-rendered quite often, this approach is quite intensive on resources.

Besides that, the application had obvious state synchronization problems. When moving between views it was not maintaining the same state of selected rows. Even though Redux was used to store application state and communicate it between components, it was not used consistently. There were still plenty of React class components that stored some parts of the state locally.

To summarize, there were two issues that needed to be solved:

  1. Poor performance due to excessive re-rendering
  2. Loss of application state when navigating views due to decentralized state stores

Since both issues were caused by (a lack of) architecture, we redesigned the structure of the application. The original implementation used:

It used Apollo, but by manually firing client.query() and after processing the response, it stored the result in the Redux store.

Fixing application state with Apollo Local State

When restructuring the application, Apollo Client was updated to 2.5. This version has a built-in local state manager (formerly apollo-link-state) and it supports REST calls with the apollo-link-rest plugin. The apollo-boost package contains the client and several useful plugins. Adopting these means that both Redux and Axios can be removed and Apollo will be used as a single source of truth. If there is a single store for the data, there is no need for synchronization and with that one of the issues is solved.

The way we used Apollo Client was also updated, to create a better separation of UI and data. Instead of using client.query() directly in the component lifecycle methods, components are split into a presentational component and enhanced with the graphql() HOC to add data from remote (i.e. GraphQL back-end) or local fields. Both utilize the Apollo cache, which fulfills multiple functions, one of them an application local state store.

Example of wrapping a component in a Query HOC:

const Books = ({ data: { books } }) => (
);
export graphql({ query: gql`
query($author: String!) {
books(author: $author) {
title
}
}`,
variables: { author: \"Mickiewicz\" })(Books);

Apollo reactively updates when using Query as a container, basically like the connect HOC in Redux. When the variables prop on the Query component is updated, it will automatically re-query. It uses the cache if possible and falls back to a network call if needed, although this behavior can be configured.

Improving performance with Local Field Resolvers

Having a single source of truth fixes the state synchronization problem. It also paves the way for improving the performance. In general, when a lot of data enters the application, it is a good idea to format it once and cascade the formatted data down to the components and it’s descendants with as little transformations to the data itself. This reduces the amount of computations in the lower components, which solves our other issue.

When using Redux, a common way to transform data in the store is using Reselect, which computes derived data from the Redux store with selectors. For Apollo this is done by:

from a data object

{ 
author: \"Mickiewicz\",
publications: [
{
title: \"Pan Tadeusz\",
date: -4291747200
}
]
}

to an array rows of cells

[
[ \"Mickiewicz\", \"Pan Tadeusz\", \"January 1834\" ]
]

Next steps

Apollo is excellent for merging data from multiple sources (in this case GraphQL, REST, local state and cache) and functions as a “single source of truth” which should solve the state synchronization problems. The local fields that Apollo uses in its local state manager can derive data, moving expensive operations from component render functions to resolvers in its application level cache. Although the issues mentioned in the introduction are now dealt with, we did encounter plenty of other issues I may dive into later. However, these are some things that you might want to take into account when working with Apollo Client:

Outside of restructuring the application, we improved performance with react-virtualized which speeds up rendering large tables. Apollo also offers GraphQL pagination. We did not use that, as we have to do our pagination on the client side to keep the sorting feature of react-virtualized in tact.

Apollo Client offers support for TypeScript, it is even possible to generate queries and typed React components from GraphQL schemas with @graphql-codegen/cli.

Also definitely use the JS GraphQL IntelliJ Plugin because it will not only auto complete queries, but it will help you think about (client side) schema’s.

When the Query component mounts, it creates an observable that subscribes to the query in the query prop. This encourages reactive behavior like RxJS (which can also be used as a state store). However, it seems that Apollo offers much less fine-grained control over the observables than what RxJS provides. And considering observables, Apollo Client effortlessly scales to web sockets!

Are you looking for inspiration on how Apollo client can be applied? I can recommend this talk by Uri Goldshtein and this introduction to Apollo state management by Sara Vieira.

\"\"

Apollo Client in Practice was originally published in Codestar blog on Medium, where people are continuing the conversation by highlighting and responding to this story.

"},{"id":"https://medium.com/p/b561e8cfbcfa","title":"Sharing is Caring! Domain objects in BOTH Scala and R with GraalVM Polyglot bindings.","author":"Nathan Perdijk","latestPublishedAt":"Wed, 01 May 2019 07:53:54 GMT","uniqueSlug":"https://medium.com/codestar-blog/sharing-is-caring-domain-objects-in-both-scala-and-r-with-graalvm-polyglot-bindings-b561e8cfbcfa?source=rss----ea5cff13e3c9---4","paragraphs":"

In any domain that goes beyond a sample project, it becomes almost inevitable that you want to use objects that accurately represent that domain. GraalVM does an adequate job of converting datastructures from R to JVM languages and back by using sensible defaults, but what do you do when the sensible defaults are not sufficient? Given that GraalVM can perform translation between its multitude of supported languages, is it possible to define a “Domain” that can be accessed by all?

This is, of course, a rhetorical question and the answer is “Yes”.

\"\"

In this article I’ll demonstrate how to share domain objects between JVM languages and guest languages on the GraalVM platform. I’m using Scala domain objects (because Scala is awesome), but you could do the same with, for instance, Java or Kotlin.

(If you’re new to GraalVM Polyglot abilities, consider also reading my previous article on the subject: using GraalVM to execute R files from Scala.)

The Problem

To demonstrate the problem we are trying to solve, we first need a pretend domain. Let’s do something with Weather Forecasts, because people always talk about the weather!

Creating weather forecasts is the kind of terribly complicated modelling business that could be built in R, but luckily we don’t actually need a working model for this article. So let’s just pretend we already have this awesome R functionality that creates weather forecasts, cleanly abstracted away in a separate file called fun_MagicHappensHere.R:

When brought into scope with R’ssource the above file will yield a magicHappensHere function that can be called and returns a data.frame with some weather forecast information. We can then return the result to Scala by simply making it the return of our R function:

Wow, that doesn’t look too bad! This won’t get many complaints from the Data Scientist, I reckon.

So, what’s wrong with this? What’s the problem?

I’m glad you asked, interlocutor! Let’s take a look on the Scala/JVM side of this equation, to see what the Data Engineer has to deal with:

Whoa… creating the Graal Context and Source is trivial, but look at the nasty type signature on that call to R! Let’s pick it apart for a bit:

Let’s see what this means when we try to use the output of this function:

I don’t know about you, but I’d feel quite uncomfortable at the thought of maintaining the code above. It’s verbose, error prone, brittle, annoying and it fails at the wrong spot if any mistakes are introduced (namely at the place of conversion, rather than the place of programming error). I wish the R function would just return a Set of WeatherForecast!

Whoops, hold on… Wait a minute…

Why don’t we just make it do that?

The Solution: Bindings

GraalVM comes with an option that makes it possible to explicitly share instances of code across the language divide. It makes it possible to add symbols to bindings that are accessible to other languages. The Graal Context has two functions that can be used to do this in a very similar way:

In this article I will be using getBindings, because it doesn’t require an explicit import on the side of the using language and it allows you to limit which languages you are exposing each binding to. Using getPolyglotBindings() is almost identical from a coding perspective though, so pick the one you like best.

Using Domain objects on both sides of the language divide

This is what our Domain object looks like:

Domain is basically a factory that can be used to spawn new instances of all the domain classes that we want to share. The classDomain itself is immutable! (As it happens, the spawned instances are too.)

WARNING: You probably don’t want to put a mutable object into bindings. If you do, this object can be mutated from any language that can reach it. Just as you don’t want multiple threads to tangle with the same mutable object, you don’t want multiple languages to access the same mutable state! (Really! Imagine having to debug race conditions across language boundaries...)

Any instance of the Domain class provides methods to spawn new instances of the following domain case classes:

Let’s put an instance of our Domain class into the bindings for R, so it can be accessed from the R guest language context:

Easy peasy. From R, the new object will simply be known as Domain and its methods will be accessible like this: Domain$methodName(arguments)

We turn a new R file, that uses this binding, into our newest Source:

And then we define the function:

Now that this is our return type, all we need to do to work with the returned WeatherForecasts is this:

That is one very happy Data Engineer! (Don’t forget to compare with the incomplete parsing above.)

Now, let’s see the impact on the DataScientist side:

As we can see, the code has become more verbose (although it’s actually quite efficient still, if you take out all the clarifying comments I put in), but not quite as bad as in the previous solution:

In this R file, we now need to convert the data.frame to proper WeatherForecast instances to be added to the WeatherForecastList we also got from Domain. But rather than doing a Parse & Pray, as we had to do with the no-bindings solution, we can now use proper constructors that will fail with intelligible errors if we make a mistake. (Sadly still only at runtime, because this is still R.) Cleanly taking values out of the data.frame is also better supported by its native language and we could add more convenience methods to more succinctly create the domain classes if we wanted to. If we have direct control over the function that creates the weather forecasts, we can even skip the data.frame altogether and exclusively use WeatherForecastList, which eliminates the extra code seen above.

The biggest advantage, though, is that we now have a very clearly defined interface. Any user can open up the Domain.scala file to see what methods are available, what parameters they take and what things they return.

Conclusion

Using Bindings to provide a clean shared domain between guest languages (like R or Python) and JVM languages (like Scala, Java or Kotlin) in GraalVM is pretty easy and gets rid of a lot of ugly and fault-sensitive parsing. It also provides a crucial stepping stone for further integration of functionalities across language boundaries.

PS: I could have added a factory for each separate domain class to the bindings, instead of giving them a shared factory. This can make the code on the R side a little shorter, but creates a less clean interface (at least to my taste).

Sourcecode

I have reused the example project from my previous article on using GraalVM to execute R files from Scala) and branched it for this article. The source code can be found here. The snippets above are taken from the linked project and altered to better fit the sizing of the article.

\"\"

Sharing is Caring! Domain objects in BOTH Scala and R with GraalVM Polyglot bindings. was originally published in Codestar blog on Medium, where people are continuing the conversation by highlighting and responding to this story.

"},{"id":"https://medium.com/p/cd7456268dc5","title":"Using generative art to create a pulsating SVG star","author":"Hamza Haiken","latestPublishedAt":"Fri, 12 Apr 2019 09:39:17 GMT","uniqueSlug":"https://medium.com/codestar-blog/using-generative-art-to-create-a-pulsating-svg-star-cd7456268dc5?source=rss----ea5cff13e3c9---4","paragraphs":"

Part 1 — Intro

I recently created a new design for our recruitment campaign at Codestar. It represents a burning star, with corona-like features, represented in an abstract way, aiming to make it feel like a pulsating stream of data (The original artist for the star is Garry Killian).

\"\"
We’re very big on only hiring Latin speakers

The rest of the team enjoyed it, and we nicknamed this design “the code star”. It was then suggested that we could try and recreate this as an animation for our website, or to simply just to generate as many different static stars as we want: a teammate’s name could be used as a random seed, and they would be given their own special code star.

In this series of blog posts, I will endeavor to explain my process in taking on this challenge, going through various subjects, in particular generative art and SVG animation.

Our goal in this series will be to re-create the above visual in SVG, and animate it to make it slowly pulsate, like the sun’s corona.

What is generative art?

The term “generative art” (or also “procedural art”) refers the making of art algorithmically, typically relying on fractals and randomness.

Famous examples of this include: that one album cover that everybody wears on a t-shirt, Minecraft’s infinitely expanding worlds, No Man’s Sky’s universe and planets, and many more.

For further learning about getting started in generative art (after reading this of course!), I recommend as starting points Generative Artistry and The Coding Train YouTube channel, which often takes on generative art challenges.

Noise

One commonly used tool in the field of generative art is noise — in particular, Perlin, or Simplex noise (which is more suited for animations since it has a lower overhead). It is used for a variety of results: terrain, smoke, clouds, textures.

This kind of noise is obtained by overlaying noise at different frequencies on top of each other, forming a cloud-like texture that expands infinitely in any direction. The nice thing about this method of constructing noise is that it can be expanded to support any number of required dimensions (in our case, a 3D space).

In a nutshell, Perlin noise is constructed by averaging noise rendered at several scales (bilinear interpolation is used to smooth out the lower frequencies):

\"\"
Image source: https://medium.com/100-days-of-algorithms/day-88-perlin-noise-96d23158a44c

When averaging all of these (using some kind of weighted distribution), the following natural, cloudy texture is obtained:

\"\"
Could this image just be the “cloud” filter in Photoshop? Who knows

Used creatively, this noise can be used to create impressive results, like this wood texture for example (and again, given the nature of Perlin noise, this texture can expand seamlessly in any direction).

\"\"
Sitting atop a mathematically generated hill is a big dream of mine

And here is an example from the game “No Man’s Sky”. The mountains in such a landscape are created using low-frequency noise (big features), the smaller hills on top of that come from the middle range of noise frequencies, and if you zoom in even closer the small dirt bumps are added on top of the hills by adding in the values of a higher frequency (this is like a fractal). Additionally, the noise formula can also be (and was) manipulated in such a way as to seamlessly wrap around a sphere.

Using noise

One of the big advantages of Perlin noise: by traveling along its plane, the intensity values increase and decrease continuously. This is not only very useful for terrain generation for creating hills and valleys, but also for animation, providing offsets that will smoothly increase or decrease randomly in a natural way.

We will use simplex-noise.js for generating our noise. This is not Perlin but Simplex noise; it looks less detailed, and is faster to compute. The library provides a simple API: just instantiate a noise object with a random seed, which you can then use for getting noise values in 2D, 3D or 4D:

let simplex = new SimplexNoise(\"tutorial seed\");
let value = simplex.noise2D(0.42, 13.37);

Precision can be as small as needed, effectively zooming in on the noise, and the whole 2D plane that can be represented with JavaScript numbers is available to us.

Here is a simple demo on how to use Simplex noise. Feel free to play around with the sliders, particularly with the z-axis (slowly).

Moving along the X- and Y-axes feels natural to us humans — it just looks like standard translation — but it shows us that the noise is indeed continuous.

Moving along the Z-axis, however, gives a totally different feeling, exposing the vertical continuity of the noise by showing us slices of what seems to be an animation.

The color values at a given pixel coordinates change continuously and smoothly while navigating along the Z direction.

This is a big clue; by using the Z-axis to represent time, we can now animate things.

But before we can animate, we will first need a drawing!

Coming up in this series

Stick around on the Codestar blog to catch the next parts in this series:

\"\"

Using generative art to create a pulsating SVG star was originally published in Codestar blog on Medium, where people are continuing the conversation by highlighting and responding to this story.

"}],"upcomingMeetups":[{"created":1697454939000,"duration":14400000,"id":"296766473","name":"Workshop Red Hat Ansible Lightspeed and other Ansible development tools","date_in_series_pattern":false,"status":"upcoming","time":1701351000000,"local_date":"2023-11-30","local_time":"14:30","rsvp_open_offset":"PT24H","updated":1697455085000,"utc_offset":3600000,"waitlist_count":0,"yes_rsvp_count":1,"is_online_event":false,"eventType":"PHYSICAL","group":{"created":1465915067000,"name":"Codestar Night","id":20072875,"join_mode":"open","lat":52.099998474121094,"lon":5.110000133514404,"urlname":"Codestar-Night","who":"Codestars","localized_location":"Utrecht, Netherlands","state":"","country":"nl","region":"en_US","timezone":"Europe/Amsterdam"},"link":"https://www.meetup.com/codestar-night/events/296766473/","description":"

You can sign up right now via this link: [https://www.ordina.com/insights/events/red-hat-openshift-workshop-2/](https://www.ordina.com/insights/events/red-hat-openshift-workshop-2/)

Recently Ansible Lightspeed has been introduced by Red Hat as an addition to existing developer tools in Ansible. Ansible Lightspeed (including IBM Watson Code Assistant) is a generative AI tool which makes it easier for developers to automate tasks in Ansible playbooks and create Ansible content. This session led by a Red Hat instructor is themed around \"A day in the life of an (Ansible) software developer\" and is focusing on tools that can help developers to create and improve Ansible playbooks in an efficient way.

**Agenda**

* 14:30 - 15:00: Registration
* 15:00 - 16:00: A day in the life of an Ansible developer
* 16:00 - 18:15: Labs
* 18:15- 18:30: Closure

**When** : November 30th 2023 van 15:00-19:00
**Where** : Ringwade 1, Nieuwegein
**Who** : Software developers, Cloud Engineers and DevOps Engineers
**What** : Bring your own laptop.

","visibility":"public","member_pay_fee":false,"featured_photo":{"id":516608243,"highres_link":"https://secure.meetupstatic.com/photos/event/2/0/3/3/highres_516608243.jpeg","photo_link":"https://secure.meetupstatic.com/photos/event/2/0/3/3/600_516608243.jpeg","thumb_link":"https://secure.meetupstatic.com/photos/event/2/0/3/3/thumb_516608243.jpeg","type":"event","base_url":"https://secure.meetupstatic.com"}}],"pastMeetups":[{"created":1696248935000,"duration":10800000,"id":"296486807","name":"Ordina Frontend Community presents: Back to basics panel discussion","rsvp_limit":15,"date_in_series_pattern":false,"status":"past","time":1697729400000,"local_date":"2023-10-19","local_time":"17:30","rsvp_close_offset":"PT72H30M","updated":1697749352000,"utc_offset":7200000,"waitlist_count":0,"yes_rsvp_count":5,"venue":{"id":26404459,"name":"Ringwade 1","lat":52.057823181152344,"lon":5.111423015594482,"repinned":true,"address_1":"Ringwade 1","city":"Nieuwegein","country":"nl","localized_country_name":"Netherlands"},"is_online_event":false,"eventType":"PHYSICAL","group":{"created":1465915067000,"name":"Codestar Night","id":20072875,"join_mode":"open","lat":52.099998474121094,"lon":5.110000133514404,"urlname":"Codestar-Night","who":"Codestars","localized_location":"Utrecht, Netherlands","state":"","country":"nl","region":"en_US","timezone":"Europe/Amsterdam"},"link":"https://www.meetup.com/codestar-night/events/296486807/","description":"

**Back to basics panel discusison**
Ordina's Frontend Community would like to present to you an open and interactive discussion about the world of frontend. We'll talk about *\"How we've gotten here and where it is going\".*

Come and join us to have a chat about how complex the world of modern front end development has become, trends we see returning from the past and how this all affects our daily jobs as frontend developers.

Topics like:

* **Have our tools** been focussed too much on **Developer Experience**, instead of the **User**?
\\- What **benefits** do our **modern stacks** have, and **for who** are these benefits?

And more, we're **taking** your **suggestions**!

https://forms.office.com/e/dLK7MbgHm6

**Programme**
**17:30 Walk-in, dinner & drinks**
A diverse dinner will be served, any dietary preferences or restrictions can be mentioned in the signup form.

**18:45 Introductions of our panelists**
We'll move to the main venue room and open with a short introduction of our panelists and their diverse experiences.

**19:00 Panel discussion**
Kick off the panel discussion with some topics, suggested by **you**! Use the signup form to add your ideas/controversial topics or other suggestions to the discussion up front!

**20:00 Closing & Drinks**
After a good hour of chatting about a diverse range of prepared topics and questions, we'll close the main room. There'll be plenty of opportunity to continue any discussions or conversations with a drink and snack before we close the venue for the day.

This event will be cross posted on Meetup.com and internally to Ordina colleagues. Therefore there will be a stricter limit on amount of registrations for this specific event.

","how_to_find_us":"By bicycle: Plenty of parking room for bicycles at the front door.\nBy public transport: Tramlines 20 & 21 stop within a short walk's distance\nBy car: Free parking in front of the building","visibility":"public","member_pay_fee":false,"featured_photo":{"id":516309713,"highres_link":"https://secure.meetupstatic.com/photos/event/2/5/f/1/highres_516309713.jpeg","photo_link":"https://secure.meetupstatic.com/photos/event/2/5/f/1/600_516309713.jpeg","thumb_link":"https://secure.meetupstatic.com/photos/event/2/5/f/1/thumb_516309713.jpeg","type":"event","base_url":"https://secure.meetupstatic.com"}},{"created":1693462430000,"duration":14400000,"id":"295795991","name":"Creating UI libraries by utilizing Storybook, ReactJs, NPM and Azure.","date_in_series_pattern":false,"status":"past","time":1695913200000,"local_date":"2023-09-28","local_time":"17:00","updated":1695935924000,"utc_offset":7200000,"waitlist_count":0,"yes_rsvp_count":2,"venue":{"id":24315864,"name":"Ordina HQ ","lat":52.05641174316406,"lon":5.110540866851807,"repinned":true,"address_1":"Ringwade 1","city":"Nieuwegein","country":"nl","localized_country_name":"Netherlands"},"is_online_event":false,"eventType":"PHYSICAL","group":{"created":1465915067000,"name":"Codestar Night","id":20072875,"join_mode":"open","lat":52.099998474121094,"lon":5.110000133514404,"urlname":"Codestar-Night","who":"Codestars","localized_location":"Utrecht, Netherlands","state":"","country":"nl","region":"en_US","timezone":"Europe/Amsterdam"},"link":"https://www.meetup.com/codestar-night/events/295795991/","description":"

Sign up for this event here: [https://www.meetup.com/utrecht-frontend-meetup/events/295531915/](https://www.meetup.com/utrecht-frontend-meetup/events/295531915/)

If you have ever attempted to extract your UI libraries into an abstract package which can be consumed just like any other NPM package. You’ll probably have encountered quite a few hurdles. For example:

1. How do I build the code, do I use CJS or ESM?

2. How do I ensure code quality?

3. How do I actually publish an NPM package?

4. Can the publishing of packages be automated by CI/CD?

5. How do I provide interactive documentation like Bootstrap or Material UI?

If you have ever encountered or wondered about these questions this workshop is for you. We will set up a Storybook Application, unit test it, publish it via CI/CD, containerize it with Docker, publish our container to Azure Container Registry and finally publish the container to an Azure web app.

The workshop will be hosted on the 28*th* of September 17:00 - 21:00, food and drinks are included!

Pre-requisites: Some experience with JavaScript. Any CI/CD experience will help but is not necessary.

A github Repo will be available for reference.

","visibility":"public","member_pay_fee":false,"featured_photo":{"id":515525035,"highres_link":"https://secure.meetupstatic.com/photos/event/1/3/a/b/highres_515525035.jpeg","photo_link":"https://secure.meetupstatic.com/photos/event/1/3/a/b/600_515525035.jpeg","thumb_link":"https://secure.meetupstatic.com/photos/event/1/3/a/b/thumb_515525035.jpeg","type":"event","base_url":"https://secure.meetupstatic.com"}},{"created":1695301754000,"duration":21600000,"id":"296251627","name":"Workshop Red Hat OpenShift","date_in_series_pattern":false,"status":"past","time":1695812400000,"local_date":"2023-09-27","local_time":"13:00","updated":1695841163000,"utc_offset":7200000,"waitlist_count":0,"yes_rsvp_count":1,"venue":{"id":24315864,"name":"Ordina HQ ","lat":52.05641174316406,"lon":5.110540866851807,"repinned":false,"address_1":"Ringwade 1","city":"Nieuwegein","country":"nl","localized_country_name":"Netherlands"},"is_online_event":false,"eventType":"PHYSICAL","group":{"created":1465915067000,"name":"Codestar Night","id":20072875,"join_mode":"open","lat":52.099998474121094,"lon":5.110000133514404,"urlname":"Codestar-Night","who":"Codestars","localized_location":"Utrecht, Netherlands","state":"","country":"nl","region":"en_US","timezone":"Europe/Amsterdam"},"link":"https://www.meetup.com/codestar-night/events/296251627/","description":"

Free registration is open @ [https://www.ordina.com/insights/events/red-hat-openshift-workshop/](https://www.ordina.com/insights/events/red-hat-openshift-workshop/)
***Note that the registration process goes via the website above as we need to setup a lab environment specifically for you. Please keep in mind that with a no-show you're potentially taking someone else's spot.***
Participate in our journey into the world of cloud-native application development and deployment. Embrace the efficiency of cloud-native CI/CD pipelines with Openshift and learn how to streamline your application lifecycle management with OpenShift GitOps. With two dynamic workshops on 27 September led by an experienced Red Hat instructor focusing on OpenShift Pipelines and OpenShift GitOps, you can gain hands-on skills and insights that enable you to stay ahead in the rapidly evolving landscape of cloud-native technology.
**Program:**
**Walk in 14:30 - 15:00 hrs**
**Introduction Red Hat and OpenShift 15:00 - 16:00 hrs**
**Labs 16:00 - 18:30 hrs**

* *1- Introduction Openshift pipelines*

OpenShift Pipelines is a cloud-native, CI/CD delivery solution to build pipelines on OpenShift using Tekton.
* 2- *OpenShift GitOps*

Start using OpenShift GitOps and start deployments with Red Hat OpenShift GitOps (based on ArgoCD) and use Kustomize, sync waves, and hooks.

**Closure 18:30 - 19:00 hrs**
Don't miss this chance to elevate your technical expertise and reserve your spot now for our upcoming Red Hat OpenShift workshop on September 27th and get up to speed in the world of modern application development and operations.
***Don't forget to bring your own laptop!***

","visibility":"public","member_pay_fee":false},{"created":1681909979000,"duration":12600000,"id":"292995726","name":"AI Hackathon","date_in_series_pattern":false,"status":"past","time":1688052600000,"local_date":"2023-06-29","local_time":"17:30","updated":1688072986000,"utc_offset":7200000,"waitlist_count":0,"yes_rsvp_count":4,"venue":{"id":24315864,"name":"Ordina HQ ","lat":52.05641174316406,"lon":5.110540866851807,"repinned":true,"address_1":"Ringwade 1","city":"Nieuwegein","country":"nl","localized_country_name":"Netherlands"},"is_online_event":false,"eventType":"PHYSICAL","group":{"created":1465915067000,"name":"Codestar Night","id":20072875,"join_mode":"open","lat":52.099998474121094,"lon":5.110000133514404,"urlname":"Codestar-Night","who":"Codestars","localized_location":"Utrecht, Netherlands","state":"","country":"nl","region":"en_US","timezone":"Europe/Amsterdam"},"link":"https://www.meetup.com/codestar-night/events/292995726/","description":"

**AI Hackathon,** by Ordina's Frontend Guild
\"Attention developers and all AI enthusiasts! Are you looking for an exciting and spontaneous challenge that will put your coding skills to the test? Then join us for a ChatGPT hackathon where you'll have two hours to create a functional and practical application using ChatGPT's natural language processing capabilities. Whether you're a seasoned developer or new to AI, this is your chance to show off your skills and creativity in a fast-paced and dynamic environment. So come as you are and see what you can accomplish with ChatGPT by your side!.\"

**Program:**
**Walk in                        17:30 hrs**
**Grab some food and drinks    18:00 hrs**
Start Hackathon 18:15 hrs

","visibility":"public","member_pay_fee":false},{"created":1685982815000,"duration":10800000,"id":"293996924","name":"Ordina presents: Exploratory Testing | Navigating Through Uncharted Territory","date_in_series_pattern":false,"status":"past","time":1686668400000,"local_date":"2023-06-13","local_time":"17:00","rsvp_close_offset":"PT48H","updated":1686682027000,"utc_offset":7200000,"waitlist_count":0,"yes_rsvp_count":1,"venue":{"id":24315864,"name":"Ordina HQ ","lat":0,"lon":0,"repinned":true,"address_1":"Ringwade 1","city":"Nieuwegein","country":"nl","localized_country_name":"Netherlands"},"is_online_event":false,"eventType":"PHYSICAL","group":{"created":1465915067000,"name":"Codestar Night","id":20072875,"join_mode":"open","lat":52.099998474121094,"lon":5.110000133514404,"urlname":"Codestar-Night","who":"Codestars","localized_location":"Utrecht, Netherlands","state":"","country":"nl","region":"en_US","timezone":"Europe/Amsterdam"},"link":"https://www.meetup.com/codestar-night/events/293996924/","description":"

As an experienced software tester, you understand the importance of ensuring that the software you test always meets the highest quality standards. While you acknowledge the value of automated testing, you also recognise that not all tests can be automated due to their complexity or cost. Additionally, you have noticed that pre-conceived tests are not always comprehensive enough to identify unforeseen issues that arise in production.

You may wonder how it's possible to include unforeseen issues in pre-conceived tests. And that's where this workshop comes in! We will introduce you to Session Based Testing, which can help you become more creative and identify potential issues before they cause problems in production. The workshop will teach you the principles of Exploratory Testing using heuristics, mnemonics, and tours. You will also learn how to apply focus to your testing efforts.

At the end of the workshop, you will receive cheat sheets and charter ideas to help you implement Exploratory Testing within your organisation and improve the quality of your software. Together, we will explore how to use this approach to identify and address potential issues, even those that may not have been considered in advance.

Key Learnings:
\\* What is Exploratory Testing
\\* How you can use ET in your day to day practice
\\* Helpful cheatsheets and templates

Don't forget to bring your laptop as it will be a hands on workshop! We take care of food and drinks.

Agenda:
17:00 Walk-in
17:15 Start diner
17:45 Start workshop
20:00 End workshop

","visibility":"public","member_pay_fee":false,"featured_photo":{"id":513443419,"highres_link":"https://secure.meetupstatic.com/photos/event/5/b/7/b/highres_513443419.jpeg","photo_link":"https://secure.meetupstatic.com/photos/event/5/b/7/b/600_513443419.jpeg","thumb_link":"https://secure.meetupstatic.com/photos/event/5/b/7/b/thumb_513443419.jpeg","type":"event","base_url":"https://secure.meetupstatic.com"}},{"created":1681385480000,"duration":7200000,"id":"292868956","name":"Codesmiths Unite Groningen","date_in_series_pattern":false,"status":"past","time":1685030400000,"local_date":"2023-05-25","local_time":"18:00","updated":1685040899000,"utc_offset":7200000,"waitlist_count":0,"yes_rsvp_count":1,"venue":{"id":26219881,"name":"Europaweg 31","lat":53.210933685302734,"lon":6.585259914398193,"repinned":true,"address_1":"Europaweg 31","city":"Groningen","country":"nl","localized_country_name":"Netherlands"},"is_online_event":false,"eventType":"PHYSICAL","group":{"created":1465915067000,"name":"Codestar Night","id":20072875,"join_mode":"open","lat":52.099998474121094,"lon":5.110000133514404,"urlname":"Codestar-Night","who":"Codestars","localized_location":"Utrecht, Netherlands","state":"","country":"nl","region":"en_US","timezone":"Europe/Amsterdam"},"link":"https://www.meetup.com/codestar-night/events/292868956/","description":"

Ordina Codesmiths stand for a shared passion in Software Engineering and knowledge sharing.
Over the last 2 years we organized Codesmiths Unite, to share knowledge in a Drive In format. Do you remember? As there's no more restrictions due to Covid we're organizing our 2023 edition in person.
So join us on the 25th of May and meet your peer developers and hear interesting learnings on topics as Cloud, Security, Frontend, Mobile and testing.

**Program:**
**Walk in                        17:30 hrs**
**Grab some food and drnks    18:00 hrs**
**Slot 1                         18:15 - 18:45 hrs**
Lessons learned with Flutter (Rogier van Apeldoorn)
**Slot 2                         18:50 - 19:20 hrs**
Cloud Design (Twan Koot & Michiel Hamers)
**Slot 3                         19:30 - 20:00 hrs**
Get started with security (Sebastiaan Zeeff)
**Drinks                        20:00 hrs**

**About the talks and presenters**

**Rogier van Apeldoorn - Lessons learned with Flutter**

Over the past two years, Ordina has been developing the consumer app for a Dutch health insurance company, using Flutter, Google's platform-independent solution.

Rogier will share his lessons learned during the building of this app.

He discusses:

* The chosen architecture and state management patterns that are used.
* Was Flutter the right technology for building the app?
* What is the learning curve for Flutter and how to jump start?
* What does he see as the future of Flutter?

**Twan Koot / Michiel Hamers - Design for costs, four pillars of economic cloud design**

Developers are being exposed to things like FinOps or a massive Azure bill. So let's start incorporating costs into our cloud design to make the best performance solution and the most economical solution!
In 2022 we see that security by design is common sense, why not incorporate the financial aspect.
In this session we will share our thoughts on maintaining grip on your cloud bill & maintaining high performance. By incorporating our four pillars of economic cloud design you are able to design cost efficient and high performant cloud solutions.
We will of course also explain \"Zero User Costs\" and \"Geo Efficiency\" so you can start today.

**Sebastiaan Zeeff - Get Started With Security: An introduction for developers**

Most developers will agree that security is an important consideration in modern software development projects. At the same time, most developers don’t consider themselves to be security experts. While most of us are doing our best, it’s difficult to know what we’re missing or what our blindspots are. Luckily enough, you don’t have to be a security expert to follow a systematic approach to security.

In this talk, I will introduce you to the OWASP DevSecOps Maturity Model, a comprehensive framework that you can use to assess the maturity of your current approach to security. It also provides you with clear steps that you can take to improve your approach to security. My main focus will be on the dimensions in the model that are directly relevant to developers and I will give you a few examples of practices that you can start implementing today!

","visibility":"public","member_pay_fee":false,"featured_photo":{"id":512042792,"highres_link":"https://secure.meetupstatic.com/photos/event/a/e/8/highres_512042792.jpeg","photo_link":"https://secure.meetupstatic.com/photos/event/a/e/8/600_512042792.jpeg","thumb_link":"https://secure.meetupstatic.com/photos/event/a/e/8/thumb_512042792.jpeg","type":"event","base_url":"https://secure.meetupstatic.com"}},{"created":1681833264000,"duration":7200000,"id":"292976982","name":"Style your React apps without stress!","date_in_series_pattern":false,"status":"past","time":1685028600000,"local_date":"2023-05-25","local_time":"17:30","updated":1685040866000,"utc_offset":7200000,"waitlist_count":0,"yes_rsvp_count":2,"venue":{"id":24315864,"name":"Ordina HQ ","lat":52.05641174316406,"lon":5.110540866851807,"repinned":true,"address_1":"Ringwade 1","city":"Nieuwegein","country":"nl","localized_country_name":"Netherlands"},"is_online_event":false,"eventType":"PHYSICAL","group":{"created":1465915067000,"name":"Codestar Night","id":20072875,"join_mode":"open","lat":52.099998474121094,"lon":5.110000133514404,"urlname":"Codestar-Night","who":"Codestars","localized_location":"Utrecht, Netherlands","state":"","country":"nl","region":"en_US","timezone":"Europe/Amsterdam"},"link":"https://www.meetup.com/codestar-night/events/292976982/","description":"

Traditionally, dynamic styling has always been a controversial topic for many JavaScript/Frontend developers. CSS Custom properties have given us many ways to improve this, however how would it feel to have the full versatile power of a programming language within CSS? With Styled components this is now possible within the React ecosystem and in this video series I will introduce the main concepts to get started. I will cover:

1. Setting up styled components
2. Converting traditional CSS in Styled Components.
3. Set up Theming with Typescript.
4. Adding global styles
5. Extending styles and more…

If you have ever worries how to so custom SaaS styling or how to easily implement a dark mode, this meetup is for you! We will dive in the How and why we would use Styled Components. It’s an OPTIONAL code-along workshop with ample opportunities to ask for questions and best practises. Within 2 hours we will cover the goals listed above and once you leave the room, you will be able to setup and use Styled Components in your own projects. that’s a promise! Who is Rodney Wormsbecher
Rodney is a senior frontend developer who’s been involved in numerous big and small web projects within the Netherlands. Over the past 3 years he has used Styled Components extensively for frontend applications and style libraries. Requirements

* Some experience with React
* Some exposure to CSS

Connect with the author? [https://www.linkedin.com/in/rocodemy](https://www.linkedin.com/in/rocodemy)

","visibility":"public","member_pay_fee":false}],"toots":{"data":[{"id":"109318878709762915","created_at":"2022-11-10T09:48:30.790Z","url":"https://mastodon.social/@codestar/109318878709762915","text":"Join us on the 24th of november for a Robotics workshop at the Ordina office!!!\n\nFREE registration through the link below and join us for an evening with a great developer community, lots of fun and challenging\nassignments. Looking forward to seeing you there!!\n\nhttps://docs.google.com/forms/d/e/1FAIpQLScausKDt8EA1TFds04ghHKXQ2cMeJHDt019nn1X0obOD3InvA/viewform\n\nSee the trailer here: https://www.linkedin.com/posts/rickyvanrijn_azure-ros2-cloud-activity-6996406427263082496-e1fX\n\n#azure #ros2 #cloud #robotics #ordina #workshop #ros #fun","replies_count":0,"reblogs_count":1,"favourites_count":1},{"id":"109312667568153179","created_at":"2022-11-09T07:28:56.284Z","url":"https://mastodon.social/@codestar/109312667568153179","text":"Join our meetup on 1 December with @StacyClouds about #Azure Web Apps with #Blazor!\nhttps://www.meetup.com/codestar-night/events/289022760/","replies_count":0,"reblogs_count":1,"favourites_count":1}],"author":{"username":"codestar","url":"https://mastodon.social/@codestar"}},"tweets":null,"playlist":[{"id":"v8rFXbLV03Q","publishedAt":"Fri May 20 2022 08:55:14 GMT+0000 (Coordinated Universal Time)","title":"Met moderne technologie bouwen aan een duurzame software-oplossing","description":["Vandebron heeft in samenwerking met Ordina en KPN,een oplossing bedacht, waarbij de drie partijen hun kennis en expertise op het gebied van zonne-energie, software-ontwikkeling, data-connectiviteit en Internet of Things met elkaar hebben gedeeld.","","Wil jij ook ‘ahead of change’ zijn? Ga naar https://www.ordina.com voor meer informatie. ","","Meer te weten komen over Ordina? Volg dan onze socials!","LinkedIn: https://nl.linkedin.com/company/ordina ","Instagram: https://www.instagram.com/ordinabenelux/"],"thumbnails":{"default":{"url":"https://i.ytimg.com/vi/v8rFXbLV03Q/default.jpg","width":120,"height":90},"medium":{"url":"https://i.ytimg.com/vi/v8rFXbLV03Q/mqdefault.jpg","width":320,"height":180},"high":{"url":"https://i.ytimg.com/vi/v8rFXbLV03Q/hqdefault.jpg","width":480,"height":360},"standard":{"url":"https://i.ytimg.com/vi/v8rFXbLV03Q/sddefault.jpg","width":640,"height":480},"maxres":{"url":"https://i.ytimg.com/vi/v8rFXbLV03Q/maxresdefault.jpg","width":1280,"height":720}}},{"id":"yWV1eOozlOQ","publishedAt":"Tue Nov 09 2021 10:12:14 GMT+0000 (Coordinated Universal Time)","title":"Ordina Codestar at Port Of Rotterdam","description":["Our Ordina Codestar colleagues talk about their experience at the PortXchange project at the Port of Rotterdam"],"thumbnails":{"default":{"url":"https://i.ytimg.com/vi/yWV1eOozlOQ/default.jpg","width":120,"height":90},"medium":{"url":"https://i.ytimg.com/vi/yWV1eOozlOQ/mqdefault.jpg","width":320,"height":180},"high":{"url":"https://i.ytimg.com/vi/yWV1eOozlOQ/hqdefault.jpg","width":480,"height":360},"standard":{"url":"https://i.ytimg.com/vi/yWV1eOozlOQ/sddefault.jpg","width":640,"height":480},"maxres":{"url":"https://i.ytimg.com/vi/yWV1eOozlOQ/maxresdefault.jpg","width":1280,"height":720}}},{"id":"tSesmVPwKZk","publishedAt":"Wed Oct 27 2021 09:01:42 GMT+0000 (Coordinated Universal Time)","title":"Ordina's draagt bij aan duurzame doelen van Havenbedrijf Rotterdam","description":["Maatschappelijke verantwoordelijkheid en duurzaamheid wordt steeds belangrijker bij onze klanten. Wij dragen hieraan bij door versnelling te brengen in transformatieprocessen. Een voorbeeld hiervan is het project voor het Havenbedrijf Rotterdam. ","","Een duurzame oplossing voor jouw bedrijf? Ga naar https://www.ordina.com voor alle mogelijkheden.","","Meer te weten komen over Ordina? Volg dan onze socials!","LinkedIn: https://nl.linkedin.com/company/ordina ","Instagram: https://www.instagram.com/ordinabenelux/"],"thumbnails":{"default":{"url":"https://i.ytimg.com/vi/tSesmVPwKZk/default.jpg","width":120,"height":90},"medium":{"url":"https://i.ytimg.com/vi/tSesmVPwKZk/mqdefault.jpg","width":320,"height":180},"high":{"url":"https://i.ytimg.com/vi/tSesmVPwKZk/hqdefault.jpg","width":480,"height":360},"standard":{"url":"https://i.ytimg.com/vi/tSesmVPwKZk/sddefault.jpg","width":640,"height":480},"maxres":{"url":"https://i.ytimg.com/vi/tSesmVPwKZk/maxresdefault.jpg","width":1280,"height":720}}},{"id":"EaQt031BByw","publishedAt":"Tue Jun 01 2021 06:49:14 GMT+0000 (Coordinated Universal Time)","title":"Martin van Es - GraphQL for the Lazy Developer","description":["Codestar Night @ Home \"generate code.*\" from 27 May 2021","Also see https://www.meetup.com/Codestar-Night/events/277737066/","","Example application mentioned at the end: https://github.com/mdvanes/7sgraph"],"thumbnails":{"default":{"url":"https://i.ytimg.com/vi/EaQt031BByw/default.jpg","width":120,"height":90},"medium":{"url":"https://i.ytimg.com/vi/EaQt031BByw/mqdefault.jpg","width":320,"height":180},"high":{"url":"https://i.ytimg.com/vi/EaQt031BByw/hqdefault.jpg","width":480,"height":360}}},{"id":"Uq5Y080Por0","publishedAt":"Tue Jun 01 2021 06:46:30 GMT+0000 (Coordinated Universal Time)","title":"Bart Kuijper - The Power of Demystifying Your Stack","description":["Codestar Night @ Home \"generate code.*\" from 27 May 2021","Also see https://www.meetup.com/Codestar-Night/events/277737066/"],"thumbnails":{"default":{"url":"https://i.ytimg.com/vi/Uq5Y080Por0/default.jpg","width":120,"height":90},"medium":{"url":"https://i.ytimg.com/vi/Uq5Y080Por0/mqdefault.jpg","width":320,"height":180},"high":{"url":"https://i.ytimg.com/vi/Uq5Y080Por0/hqdefault.jpg","width":480,"height":360},"standard":{"url":"https://i.ytimg.com/vi/Uq5Y080Por0/sddefault.jpg","width":640,"height":480},"maxres":{"url":"https://i.ytimg.com/vi/Uq5Y080Por0/maxresdefault.jpg","width":1280,"height":720}}}]},"__N_SSG":true} \ No newline at end of file +{"pageProps":{"publications":[{"id":"https://medium.com/p/cbf6741337d","title":"Micro Frontends in A Nutshell","author":"mdworld","latestPublishedAt":"Fri, 08 Apr 2022 06:56:06 GMT","uniqueSlug":"https://medium.com/codestar-blog/micro-frontends-in-a-nutshell-cbf6741337d?source=rss----ea5cff13e3c9---4","paragraphs":"

You may have heard of a Micro Frontends recently and felt it a bit difficult to grasp what exactly it is and if it is something you should get involved in. I’ll try to give a summary of the what, why, how, and when of the current state. To provide a high-over summary, I’ll also add some recommended reading if you would like to get more details.

Why use Micro Frontends?

Do you have a very large front-end code-base?

And by large, I’m talking about 50+ developers in a dozen of teams or more, probably cross-department, working on the same code-base in some manner. Do you have enterprise-scale continuous integration with e.g. GitLab, Bamboo running so many pipelines that the bottleneck is no longer a matter of adding more pods? Do you employ configuration managers or an Ops department to make sure deployments won’t affect each other too much? Do you have considerable codebases in incompatible front-end stacks, e.g. because of a migration from AngularJS to Angular >2?

Then chances are you need to use Micro Frontends. Or actually, you most probably are already using Micro Frontends.

What are Micro Frontends?

How is it possible you would not know you are using Micro Frontends? And why are we just now hearing so much about them? The truth is that although the term is relatively new it actually covers any range of solutions to integrate a collection of smaller frontends into one application.

Similar to Micro Service architectures, Micro Frontends facilitate large codebases by breaking them up into manageable pieces. This means:

The term is now popularized because of the advent of Module Federation in Webpack 5. Webpack 5 has been released towards the end of 2020, but this new major release is taking some time to be integrated in relevant tooling, e.g. Nx and Ng CLI.

Note that Micro Frontends (MFEs) are sometimes also referred to as Micro Apps.

How do you build Micro Frontends?

Since Micro Frontends as a concept are not new, some solutions that can be classified as Micro Frontends are ancient, considering the speed of development in the frontend ecosystem. Here are some of them, to give an idea of how broad Micro Frontends can be interpreted:

I won’t go into all the details about the pros and cons of each of these solutions. Instead I refer you to the recommended reading list below.

Note that solutions can be combined: you can have a deployment monolith (that expects components that are all using the same stack) but wrap components in Web Components to provide an abstraction layer and use different stacks to produce the Web Components. Additionally, you can use Web Components in combination with Module Federation for instance if you are migrating towards Module Federation as a Micro Frontends solution. Consider this schematic representation of a web application:

\"\"
Schematic representation of a web application

This could be implemented with different platforms like Angular and React by wrapping them in Web Components:

\"\"
Web Components diagram

Module Federation is the newest solution and many libraries are still adapting to it. Last year, Nx 12 released with support for Webpack 5 and Module Federation. See a real working example here https://code-star.github.io/nx-reference-shell/ or its source in https://github.com/code-star/nx-reference.

Because Micro Frontends break up a codebase into smaller, more manageable fragments, they are often mentioned in combination with Monorepo solutions like Nx or yarn/npm workspaces. However, it is perfectly possible to implement Micro Frontends without monorepos!

When to use Micro Frontends?

New technology inspires developers to experiment, but Micro Frontends and with that Module Federation are not worth the upkeep for small to medium applications. All-in solutions like Next or Gatsby are great fits for smaller applications and custom Angular applications, when well organized, scale very well up to enterprise level.

However, no framework inherently supports older versions of itself. So if a big bang migration from AngularJS to Angular or any other framework for that matter, you’ll end up with some kind of Micro Frontends solution. Plenty of enterprise codebases currently use some combination of hyperlinks and deployment monoliths.

This could look like a bank that offers a set of public pages (e.g. the general home page, and the landing pages of its departments) referencing each other with hyperlinks and a protected monolith app with many components (e.g. checking account, subscriptions to bank products, investments on one page).

\"\"
Hyperlinks and Monolith diagram

Exploring Module Federation can be worth it if continuous integration is slowed down too much because of the large amounts of tests and compilation of all the involved components. But note that there are other approaches, such as using Nx monorepos with properly set up hierarchy and running only affected tests.

Another reason to use Module Federation can be the need to support multiple frameworks. Compared to Web Components, Module Federation improves the runtime isolation of components while simultaneously reducing isolation of shared dependencies to reduce the overall footprint of the application.

Compare to the diagram for the earlier example using macro Web Components, you can see that lodash, Angular and React are only loaded once, despite being used by multiple isolated components:

\"\"
Module Federation diagram

Want to know more?

If you want to know more about Micro Frontends, Module Federation or Monorepos, you can contact met at @mdworldNL on Twitter or mail codestar@ordina.nl. We have experience with enterprise frontend at all the major banks and many governmental departments in the Netherlands.

When you want more background information as a developer, you can also read the articles provided below.

Recommended in-depth reading

Angular Architects:

By my colleague Peter Eijgermans:

This article was originally published at https://mdworld.nl/micro-frontends-in-a-nutshell

\"\"

Micro Frontends in A Nutshell was originally published in Codestar blog on Medium, where people are continuing the conversation by highlighting and responding to this story.

"},{"id":"https://medium.com/p/befc396d6dc5","title":"Tika NERding: Getting started using Named-Entity Recognition with OpenNLP on the JVM (Scala, Java…","author":"Nathan Perdijk","latestPublishedAt":"Fri, 06 Nov 2020 15:14:42 GMT","uniqueSlug":"https://medium.com/codestar-blog/tika-nerding-getting-started-using-named-entity-recognition-with-opennlp-on-the-jvm-scala-java-befc396d6dc5?source=rss----ea5cff13e3c9---4","paragraphs":"

Tika NERding: Getting started using Named-Entity Recognition with OpenNLP on the JVM (Scala, Java, Kotlin…)

For DataScience!

Some things are hard, some things are not… Turns out that doing NER (Named-Entity Recognition) on the JVM is… not! (Wait, that sounds familiar…)

\"\"

NER is the automated process of annotating words and phrases in sentences with relevant entity information, such as marking a word as a Person, or a Location. This can come in quite handy when doing automated text analysis and is a staple in the DataScience community. As the trouble with DataScience is often getting it into production, it is extremely handy that this technique can be directly used from JVM-languages. Now we can embed this technology in production ready applications built in Java, Scala, Kotlin...

First things first, the dependencies. These are all the dependencies from the .pom.xml file used for this example project:

Yes, that’s it.

For doing NER on String this is really all we need, but Apache Tika can also extract text from PDFs or even perform OCR, but you’ll need additional dependencies.

Then we need to download the models that we want to use and place them in our resources folder. You can download suitable OpenNLP models from http://opennlp.sourceforge.net/models-1.5/. These are conveniently wrapped in .bin format and should NOT be unpacked.

For this example, we will be using English language Models that can recognise Date, Location, Organization and Person, but there are also models available in other languages. Every model you want to use, you’ll need to add to a Java Map (or you can use SystemProperties for Tika to “discover”, but that’s a method I don’t like very much):

Now models contains four models, so let’s feed them to Tika:

Alright, now all we need is to feed a String of text to the nerRecogniser:

And now you can just go about using the results. Tika will return a Map, containing a key for each model that has managed to find matching results, and with each key there’s a value containing those results. In order to improve the prints, I’ve done a bit of tinkering as it is now DEMO time.

I’m using the contents of the Wikipedia article on the Peace of Utrecht.

For the first paragraph, this is my input text:

\"The Peace of Utrecht is a series of peace treaties signed by the belligerents in the War of the Spanish Succession, in the Dutch city of Utrecht between April 1713 and February 1715. The war involved three contenders for the vacant throne of Spain, and involved much of Europe for over a decade. The main action saw France as the defender of Spain against a multinational coalition. The war was very expensive and bloody and finally stalemated. Essentially, the treaties allowed Philip V (grandson of King Louis XIV of France) to keep the Spanish throne in return for permanently renouncing his claim to the French throne, along with other necessary guarantees that would ensure that France and Spain should not merge, thus preserving the balance of power in Europe.\\n\\nThe treaties between several European states, including Spain, Great Britain, France, Portugal, Savoy and the Dutch Republic, helped end the war. The treaties were concluded between the representatives of Louis XIV of France and of his grandson Philip on one hand, and representatives of Anne of Great Britain, Victor Amadeus II of Sardinia, John V of Portugal and the United Provinces of the Netherlands on the other. Though the king of France ensured the Spanish crown for his dynasty, the treaties marked the end of French ambitions of hegemony in Europe expressed in the continuous wars of Louis XIV, and paved the way to the European system based on the balance of power.[1] British historian G. M. Trevelyan argues:\\n\\nThat Treaty, which ushered in the stable and characteristic period of Eighteenth-Century civilization, marked the end of danger to Europe from the old French monarchy, and it marked a change of no less significance to the world at large, — the maritime, commercial and financial supremacy of Great Britain.[2]\\n\\nAnother enduring result was the creation of the Spanish Bourbon Dynasty, still reigning over Spain up to the present while the original House of Bourbon has long since been dethroned in France.\"

And these are the results from Tika NER:

Locations: Britain, Milan, Nova Scotia, Cape Breton, Italy, France, Africa, Sicily, North Sea, North America, Amazon, Spain, Rastatt, Portugal, Sacramento, North
Organisations: Article XIII, Spain
Persons: Philip V, Philippe, Philip, Louis XIV's, Louis XV, Charles VI., Oyapock, Saint Kitts
Date: 1713, 1720, 1713., 1712, 1714

And a second example, the second part of the article:

\"The War of the Spanish Succession was occasioned by the failure of the Habsburg king, Charles II of Spain, to produce an heir. Dispute followed the death of Charles II in 1700, and fourteen years of war were the result.\\n\\nFrance and Great Britain had come to terms in October 1711, when the preliminaries of peace had been signed in London. The preliminaries were based on a tacit acceptance of the partition of Spain's European possessions. Following this, the Congress of Utrecht opened on 29 January 1712, with the British representatives being John Robinson, Bishop of Bristol, and Thomas Wentworth, Lord Strafford.[3] Reluctantly the United Provinces accepted the preliminaries and sent representatives, but Emperor Charles VI refused to do so until he was assured that the preliminaries were not binding. This assurance was given, and so in February the Imperial representatives made their appearance. As Philip was not yet recognized as its king, Spain did not at first send plenipotentiaries, but the Duke of Savoy sent one, and the Kingdom of Portugal was represented by Luís da Cunha. One of the first questions discussed was the nature of the guarantees to be given by France and Spain that their crowns would be kept separate, and little progress was made until 10 July 1712, when Philip signed a renunciation.[4]\\n\\nWith Great Britain, France and Spain having agreed to a \\\"suspension of arms\\\" (armistice) covering Spain on 19 August in Paris, the pace of negotiation quickened. The first treaty signed at Utrecht was the truce between France and Portugal on 7 November, followed by the truce between France and Savoy on 14 March 1714. That same day, Spain, Great Britain, France and the Empire agreed to the evacuation of Catalonia and an armistice in Italy. The main treaties of peace followed on 11 April 1713. These were five separate treaties between France and Great Britain, the Netherlands, Savoy, Prussia and Portugal. Spain under Philip V signed separate peace treaties with Savoy and Great Britain at Utrecht on 13 July. Negotiations at Utrecht dragged on into the next year, for the peace treaty between Spain and the Netherlands was only signed on 26 June 1714 and that between Spain and Portugal on 6 February 1715.[5]\\n\\nSeveral other treaties came out of the congress of Utrecht. France signed treaties of commerce and navigation with Great Britain and the Netherlands (11 April 1713). Great Britain signed a like treaty with Spain (9 December 1713).[5]\"

And the results:

Locations: 1715.[16], Britain, Spanish Netherlands, Austrian Netherlands, France
Organisations: Oxford, House of, United Provinces, Dutch, Austro-Dutch Barrier Treaty, Harley, Duke, Earl, Allied
Persons: Robert Harley, William III, Earl
Date: 1710, 1709., May 1711), 1706

As you can see, not everything is found, or classified correctly, but it provides a good starting point for further text analysis and it took very little effort to get this working at all! Named-Entity Recognition is a tricky technique, so you may need to preprocess your texts a bit before you get good analysis results for your particular data set, but it’s definitely not difficult to get started.

You can download suitable OpenNLP models from http://opennlp.sourceforge.net/models-1.5/.

Check out the Apache Tika documentation to see what other great functionality is available.

If you want to take a closer look at this example, you can check it out from Github: https://github.com/NRBPerdijk/examplenertikascala/

Last but not least, kudos to the Apache Software Foundation for their continuing work towards great Open Source solutions.

\"\"
\"\"

Tika NERding: Getting started using Named-Entity Recognition with OpenNLP on the JVM (Scala, Java… was originally published in Codestar blog on Medium, where people are continuing the conversation by highlighting and responding to this story.

"},{"id":"https://medium.com/p/f5d2bfe9b397","title":"Tika Tika! Getting started doing OCR with Apache Tika andTesseract from the JVM","author":"Nathan Perdijk","latestPublishedAt":"Fri, 10 Apr 2020 15:29:03 GMT","uniqueSlug":"https://medium.com/codestar-blog/tika-tika-getting-started-doing-ocr-with-apache-tika-andtesseract-from-the-jvm-f5d2bfe9b397?source=rss----ea5cff13e3c9---4","paragraphs":"

Tika Tika! Getting started doing OCR with Apache Tika andTesseract from the JVM (Scala, Java, Kotlin…).

I can do DataScience, mate!

Some things are hard. Some things are not… Turns out that using OCR (Object Character Recognition) using Tesseract from the JVM is… not hard!

\"\"

The trickiest part, really, is setting up Tesseract on the machine you want to do your OCR on. Once you have managed to do that, you can just use the following Scala examples to use Apache Tika to do OCR in your own JVM project.

First things first. Taking care of your dependencies…

Add these to your pom.xml or other build tool equivalent:

Then, we need to properly configure a Tika Parser

We need one in order to do actually do any parsing. Because this kind of configuration tends to be ugly, I have put it all inside its own object/class to keep it separate from the rest of the code:

Finally, we have to create…

The code that provides the file to be OCRed.

We just turn the file we want to OCR into an InputStream and hand that off to the TikaOCRParser we specified above for parsing. Because using InputStreams and doing parsing are two IO processes that can (definitely) throw Exceptions, I have delegated the handling of the InputStream using Scala’s Using functionality, which will automatically wrap the whole operation into a Try while also making sure that the InputStream is closed when everything is done, even when exceptions are thrown. If the result is a Success, I convert it into a regular String, which can then be printed, or otherwise used at your convenience.

(The example file is a jpeg, but lots of different image formats, as well as PDF, are supported. Some, like JPEG2000, might require extra supporting software to be installed on the machine.)

So, that’s it. Pretty easy, right? Check out the Apache Tika documentation to see what other great functionality is available. Tesseract OCR is a pretty tricky field in and off itself, so be sure to check out all the tweaks you may have to make for your particular dataset. If you want to see the full code for this example, you can check it out on GitHub. Last but not least, kudos to the Apache Software Foundation for their continuing work towards great Open Source solutions.

Edit: I also wrote a short intro using Apache Tika to do Named-Entity Recognition (NER): Tika NERding: Getting started using Named-Entity Recognition with OpenNLP on the JVM

\"\"
\"\"

Tika Tika! Getting started doing OCR with Apache Tika andTesseract from the JVM was originally published in Codestar blog on Medium, where people are continuing the conversation by highlighting and responding to this story.

"},{"id":"https://medium.com/p/65158c284034","title":"Upgrading to Angular 9: My experience","author":"Bjorn ‘Bjeaurn’","latestPublishedAt":"Fri, 14 Feb 2020 12:32:47 GMT","uniqueSlug":"https://medium.com/codestar-blog/upgrading-to-angular-9-my-experience-65158c284034?source=rss----ea5cff13e3c9---4","paragraphs":""},{"id":"https://medium.com/p/2aeff1303749","title":"Leibniz equality in TypeScript","author":"Werner de Groot","latestPublishedAt":"Tue, 25 Jun 2019 16:21:37 GMT","uniqueSlug":"https://medium.com/codestar-blog/leibniz-equality-in-typescript-2aeff1303749?source=rss----ea5cff13e3c9---4","paragraphs":"

In this post I’ll explain how you can use Leibniz equality to safely type your higher-order components in React, although it can be used in many other places (outside the React ecosystem) too.

Introduction

At the client I’m currently working for we use a lot of different charts to visualize processes over time. We have line charts, Gantt charts, you name it. Each of those charts features buttons which allows users to zoom in or out.

I’d like to use a simplified version of one of those graphs to explain what Leibniz, a German mathematician who lived well over 300 years ago, has to do with TypeScript.

Motivating example

Let’s suppose our graph looks a bit like this:

\"\"

I use a component Graph which takes the following props:

What do we need to show a graph? We need:

Zooming in and out

In this aside, I’d like to show you the function that handles zooming in or out. It’s not really relevant to the rest of the story (and you can skip this if you like) but it might come in handy if you wish to code along with this blog post.

Higher-order component

Although it is tempting to let this component manage its own dayStart and dayEnd (especially now that we can use hooks), it has two benefits to manage that state externally:

If I would create a higher-order component (HOC) to manage that state for me, I would get the best of both worlds. I get an easy to use component which manages its own state if I wrap Graph in this HOC, but I get a lot of power if I choose not to.

Furthermore, I can apply this HOC to many other components which have a time axis and support some form of zooming in and out.

What should this HOC look like? What is the input? And what is the output?

The HOC we will write will provide the following props to the inner component (which we’ll call Inner in what follows):

It will produce a component (which we’ll call Outer from now on) that takes the following props¹:

This might be a bit intimidating. What this says is that we can determine the props to the outer component (OuterProps) from the props to the inner component (InnerProps) by removing all values that are shared with TimeAxisProps (dayStart, dayEnd, onZoomIn and onZoomOut to be precise)².

Now that we know what the HOC should do, we can focus on how it should do it:

That’s a big piece of code! We can see how to handle zooming in and zooming out. We can also see how we can combine both the OuterProps and the TimeAxisProps to render the Inner-component. You might also have noticed that InnerProps extends TimeAxisProps. Constraining our generic type parameter it this way ensures that we can only apply this HOC on components that have at least the props dayStart, dayEnd, onZoomIn and onZoomOut that we’d like to provide to it. If that component doesn’t have these four props, why even apply WithTimeAxis, right?

Trouble

There is, however, a tiny problem… It doesn’t compile!

\"\"

But why doesn’t it? TypeScript has trouble figuring out that the combination of OuterProps and TimeAxisProps is equal to InnerProps. Although this is true for the case with GraphProps, it isn’t true in general.

To give you an example in which this isn’t true, let’s suppose that we try to apply the HOC to a component CounterExample with the following props:

where I’d like to point your attention to the dayStart: 0.

I admit, this is a bit farfetched, but it does illustrate the point. We shouldn’t apply WithTimeAxis to CounterExample as the HOC might provide a dayStart that is not equal to zero. In fact, changing the zoom level multiple times ensures that dayStart will eventually be non-zero, even if it was equal to zero initially.

The TypeScript isn’t complaining about this when we do try to apply WithTimeAxis to CounterExample, as CounterExampleProps nicely extends TimeAxisProps as I required. CounterExampleProps is more specific than TimeAxisProps (because the type 0 is more specific than number) but that is allowed for subtypes. Instead, the compiler has noticed this possibility even before we did, and that is why our HOC doesn’t compile!

The root of our issues is with the InnerProps extends TimeAxisProps constraint. What we try to express is that all properties of TimeAxisProps are shared with InnerProps without allowing for subtypes. Unfortunately extends is currently the best we can do. In fact, it’s the only type of constraint we can express on our generic type parameters in TypeScript.

Hope on the horizon

We can solve this problem by pushing the burden of proof up a level. We ask the user for a function convert that is able to convert the combination of OuterProps and TimeAxisProps (which can be expressed in TypeScript as OuterProps & TimeAxisProps) to InnerProps. If the user can do that, we can call Inner with the right props:

What does this conversion function look like in the example of GraphProps? It’s not very difficult at all! In the example of GraphProps we can see that:

What it boils down to is that we are asked to provide a function that makes this very trivial conversion:

We can even use the identity function if we’d like:

For CounterExample we are asked to provide a conversion function that takes an object with dayStart: number to dayStart: 0. We could simply provide a conversion function that maps every dayStart (whether it is 1, 2, 99 or something else) to 0 but that would clearly not be in the spirit of WithTimeAxis. If I would instead try to use something identity in this case, TypeScript would complain.

\"\"

which is a rather nice way of hearing about this compilation error I think. (Especially the note at the bottom that says “Type ‘number’ is not assignable to type ‘0’” points you in the right direction immediately.)

As we’ve concluded earlier, OuterProps & TimeAxisProps is not equal to CounterExampleProps, and the compiler can tell you that. If you cannot use something like identity or trivial, that means you probably shouldn’t use this HOC.

This is really the crucial step of this blog, so take some time to digest this. We’ve pushed the burden of proving that OuterProps & TimeAxisProps to InnerProps from Outer (where that’s hard or even impossible to do) to the consumers of this component (where that is easy or even trivial to do). We can’t prove this in general, but we can do it case-by-case every time we apply WithTimeAxis.

Leibnizian equality

A famous mathematician called Leibniz described a form of equality in which two things (a and b) can be considered to be equal if every predicate that holds for a also holds for b (and vice versa).

In TypeScript, we can express this as

Two types A and B are equal if every function that maps A to B is also a mapping from B to A. You can see that it’s only possible to construct such a function if A is equal to B. In that case Leibniz collapses to type Leibniz = (a: A) => A (in other words, it is our identity function).

Leibniz is a formalization of the technique we used in the previous section with a HOC:

By requiring a Leibniz & TimeAxisProps, InnerProps> this function expresses that it can only do its job if OuterProps & TimeAxisProps and InnerProps are equal.

Because Leibniz<...> serves as our type constraint, we can even drop the extends from InnerProps extends TimeAxisProps. This is no real loss as that extends wasn’t doing a very good job anyways.

Conclusion

Sometimes we need something stricter than extends, or we’d like to constrict the type parameter in the other direction (number extends T instead of T extends number). In those cases Leibniz<...> can be your friend. In my experience using a Leibniz<...> improves the readability of your type constraints when those constraints get more complicated (or include three or more different types).

Afterthoughts

This technique was first used in Typing Dynamic Typing (Baars and Swierstra, ICFP 2002) but I haven’t seen it used in TypeScript anywhere yet. I’m really interested to hear how you would tackle the problem addressed in this post without using a Leibniz<...> or if you’ve seen it used in similar (or different!) places. Let me know!

[1]: Omit will be introduced in TypeScript 3.5. In the meantime, you can define it yourself as type Omit = Pick> .

[2]: We’ve defined OuterProps in terms of InnerProps. Like in mathematics, where you can express y in terms of x (y = 2x) or x in terms of y (x = y / 2), TypeScript allows me to reverse this relationship. We get

No need for complicated tricks like Omit<...>. Unfortunately, this doesn’t work. Because we start out with an Inner-component, from which we generate an Outer-component, we should start out with an InnerProps, from which we derive the OuterProps. If we would reverse this relationship by writing

we’d lose the ability for TypeScript to correctly infer the right types:

\"\"

In our example, the compiler would infer OuterProps to be equal to GraphProps, which includes dayStart, dayEnd, onZoomIn and onZoomOut so when you try to use the resulting component you are still asked to provide those props (even though they will by overwritten by the ones the HOC provides).

If you don’t mind helping the compiler a hand by providing the type yourself (instead of letting TypeScript infer it) then this is a very nice way of writing HOC’s and you needn’t read the rest of the blog.

\"\"

Leibniz equality in TypeScript was originally published in Codestar blog on Medium, where people are continuing the conversation by highlighting and responding to this story.

"},{"id":"https://medium.com/p/6a3f4b167852","title":"Event sourcing with Akka Persistence","author":"Nick ten Veen","latestPublishedAt":"Fri, 07 Jun 2019 12:40:24 GMT","uniqueSlug":"https://medium.com/codestar-blog/event-sourcing-with-akka-persistence-6a3f4b167852?source=rss----ea5cff13e3c9---4","paragraphs":"

Asynchronous pains

In one of our projects at the Port of Rotterdam we do a lot of stream processing where we require intermediate state. We are using Event Sourcing with Akka Persistence. It allows us to create robust stateful streaming applications that can maintain state between application restarts. We were struggling a bit writing our command handlers since we do a bunch of asynchronous operations. Akka Persistence does not allow you to handle command asynchronously which means you need to deal with this yourself. Let us explore the problem in a simplified event sourcing application.

Event Sourcing

Let us create a simple implementation of an event sourcing system. A simple calculator that can add and subtract values. First we define our state, which is simply an integer value:

The state can only be modified by firing events. Let us create two possible operations, adding and subtracting from the state:

Now that we have a definition for our state and possible events, we can write a handler that will process these events:

We can test the event handler to verify that the events are processed correctly:

Commands

In event sourcing, events are immutable facts that happened. These events should be handled deterministically without any side effect. However, sometimes we need to perform side effects. For example when we need to query a database to check if an operation is allowed. We can use the command abstraction for this purpose. A command is a request to do something. Requests can be accepted or denied, or even transformed. They are also allowed to perform side effects. We can define commands for addition and subtraction:

A command handler can process these commands and decide to fire zero or more events:

We can test the command handler to verify it will fire events accordingly:

The command handler and event handler can be folded together to calculate the state for a given list of commands:

This all works fine, but if we want to recover the state during a crash or restart, we also need to store the events that we persist. We need a function that accumulates the events while calculating the state:

We can keep the accumulated state in memory during processing and at the same time persist the generated events somewhere. On restarts we can replay these events with the eventHandler to restore our state.

Akka Persistence

This pattern is encoded in Akka Persistence and allows us to have actors with state that can be recovered after crashes and restarts. The command handler is a little bit different. Instead of returning a list of events that happened, you can specify an Effect. These effects are simply an encoding of possible actions a persistent actor can do after receiving a command:

These effects can be composed together to (for example) persist multiple events. In our example we can write a simple command handler:

Asynchronous command handling

One issue about the commandHandler is that it is synchronous. There are currently no plans for aynchronous command handlers in akka persistence.
If you want to do some asynchronous processing before deciding to persist an event, you need to introduce extra commands. For example, lets say we want to have a check if a specific addition or subtraction is allowed before we emit an event. We really need to do this asynchronously for some reason, so lets create a definition of our permission check:

To be able to add this to our command handler, we need an extra command that is fired after validation. We also group our previous commands into a subtype so it can be a parameter of our new command:

With this definition we can rewrite our event handler to take this check into account:

This does work, however we lost a property that might be important to us.
The order in which the algebraic commands are processed is lost due to the asynchronous boundary. Say our check is really slow for some specific elements. Other elements that arrived later might have been processed already and arrive out of order:

If we would process the following commands in order, the outcome might have a different order:

You could fix this by storing inflight messages in some (non-persistent) state,
or by using the ask pattern and waiting for replies before sending each command. Currently (as far as I am aware) you are unable to store volatile state in a persistent actor. This means that if you want to store messages that are in flight, you need to use persistence for this. We can extend the state to store this along with a persistent event to signal inflight messages:

Previously we only fired a command if an operation is allowed, but since we also need to unstash if an operation is not allowed, we always need to fire a command for a result. So we need to modify our OperationAllowed command:

Our event handler is now responsible for handling this extra event and cleaning up after a command has been successfully processed:

Finally we need to rewrite our command handler to stash incoming commands as long as there is still a message in flight.
After a command is successfully processed, we need to unstash to continue processing potentially stashed commands:

After all this there are still a few concerns with this implementation.
What if checkPermission fails? We would need to extend the example to deal with failing futures as well. Moreover, we persist the state of inflight messages so it survives restarts. However after a restart this message is not in flight and we might wait for eternity for it to resolve. This example illustrates that you can handle commands asynchronously, but in order to ensure messages are processed in the correct order, we needed to add error-prone synchronisation code.

Conclusion

You can do asynchronous command handling with Akka Persistence. It does however require you to write some error-prone boilerplate code. Can we do better? Are persistent actors the correct approach for this problem? Maybe we can express the problem in a different paradigm where we still have the nice property of state recovery, while also allowing us to handle commands asynchronously. Maybe we could use stream processing to have a cleaner solution to our problem. But that is for another blog post.

\"\"

Event sourcing with Akka Persistence was originally published in Codestar blog on Medium, where people are continuing the conversation by highlighting and responding to this story.

"},{"id":"https://medium.com/p/9790212aa211","title":"How we automated our Angular updates","author":"Bjorn ‘Bjeaurn’","latestPublishedAt":"Tue, 21 May 2019 13:37:13 GMT","uniqueSlug":"https://medium.com/codestar-blog/how-we-automated-our-angular-updates-9790212aa211?source=rss----ea5cff13e3c9---4","paragraphs":""},{"id":"https://medium.com/p/f81434f6f8d7","title":"Apollo Client in Practice","author":"mdworld","latestPublishedAt":"Thu, 02 May 2019 18:24:29 GMT","uniqueSlug":"https://medium.com/codestar-blog/apollo-client-in-practice-f81434f6f8d7?source=rss----ea5cff13e3c9---4","paragraphs":"

Some time ago I joined a team that is working on a search application. The application takes search terms and displays the results in a table with potentially dozens of columns and hundreds of rows, even before pagination. It is implemented in React and uses Apollo for GraphQL calls. I was surprised to find it noticeably slow when a lot of search results were retrieved. React is well-known for leveraging virtual DOM to optimize performance and GraphQL should even be able to add caching to further optimize performance on the side of network requests.

Looking into the performance tab of Chrome dev tools lead me to believe the performance problems were caused by computations in the bottom components (e.g. formatting in cells). Because there are so many and they are re-rendered quite often, this approach is quite intensive on resources.

Besides that, the application had obvious state synchronization problems. When moving between views it was not maintaining the same state of selected rows. Even though Redux was used to store application state and communicate it between components, it was not used consistently. There were still plenty of React class components that stored some parts of the state locally.

To summarize, there were two issues that needed to be solved:

  1. Poor performance due to excessive re-rendering
  2. Loss of application state when navigating views due to decentralized state stores

Since both issues were caused by (a lack of) architecture, we redesigned the structure of the application. The original implementation used:

It used Apollo, but by manually firing client.query() and after processing the response, it stored the result in the Redux store.

Fixing application state with Apollo Local State

When restructuring the application, Apollo Client was updated to 2.5. This version has a built-in local state manager (formerly apollo-link-state) and it supports REST calls with the apollo-link-rest plugin. The apollo-boost package contains the client and several useful plugins. Adopting these means that both Redux and Axios can be removed and Apollo will be used as a single source of truth. If there is a single store for the data, there is no need for synchronization and with that one of the issues is solved.

The way we used Apollo Client was also updated, to create a better separation of UI and data. Instead of using client.query() directly in the component lifecycle methods, components are split into a presentational component and enhanced with the graphql() HOC to add data from remote (i.e. GraphQL back-end) or local fields. Both utilize the Apollo cache, which fulfills multiple functions, one of them an application local state store.

Example of wrapping a component in a Query HOC:

const Books = ({ data: { books } }) => (
);
export graphql({ query: gql`
query($author: String!) {
books(author: $author) {
title
}
}`,
variables: { author: \"Mickiewicz\" })(Books);

Apollo reactively updates when using Query as a container, basically like the connect HOC in Redux. When the variables prop on the Query component is updated, it will automatically re-query. It uses the cache if possible and falls back to a network call if needed, although this behavior can be configured.

Improving performance with Local Field Resolvers

Having a single source of truth fixes the state synchronization problem. It also paves the way for improving the performance. In general, when a lot of data enters the application, it is a good idea to format it once and cascade the formatted data down to the components and it’s descendants with as little transformations to the data itself. This reduces the amount of computations in the lower components, which solves our other issue.

When using Redux, a common way to transform data in the store is using Reselect, which computes derived data from the Redux store with selectors. For Apollo this is done by:

from a data object

{ 
author: \"Mickiewicz\",
publications: [
{
title: \"Pan Tadeusz\",
date: -4291747200
}
]
}

to an array rows of cells

[
[ \"Mickiewicz\", \"Pan Tadeusz\", \"January 1834\" ]
]

Next steps

Apollo is excellent for merging data from multiple sources (in this case GraphQL, REST, local state and cache) and functions as a “single source of truth” which should solve the state synchronization problems. The local fields that Apollo uses in its local state manager can derive data, moving expensive operations from component render functions to resolvers in its application level cache. Although the issues mentioned in the introduction are now dealt with, we did encounter plenty of other issues I may dive into later. However, these are some things that you might want to take into account when working with Apollo Client:

Outside of restructuring the application, we improved performance with react-virtualized which speeds up rendering large tables. Apollo also offers GraphQL pagination. We did not use that, as we have to do our pagination on the client side to keep the sorting feature of react-virtualized in tact.

Apollo Client offers support for TypeScript, it is even possible to generate queries and typed React components from GraphQL schemas with @graphql-codegen/cli.

Also definitely use the JS GraphQL IntelliJ Plugin because it will not only auto complete queries, but it will help you think about (client side) schema’s.

When the Query component mounts, it creates an observable that subscribes to the query in the query prop. This encourages reactive behavior like RxJS (which can also be used as a state store). However, it seems that Apollo offers much less fine-grained control over the observables than what RxJS provides. And considering observables, Apollo Client effortlessly scales to web sockets!

Are you looking for inspiration on how Apollo client can be applied? I can recommend this talk by Uri Goldshtein and this introduction to Apollo state management by Sara Vieira.

\"\"

Apollo Client in Practice was originally published in Codestar blog on Medium, where people are continuing the conversation by highlighting and responding to this story.

"},{"id":"https://medium.com/p/b561e8cfbcfa","title":"Sharing is Caring! Domain objects in BOTH Scala and R with GraalVM Polyglot bindings.","author":"Nathan Perdijk","latestPublishedAt":"Wed, 01 May 2019 07:53:54 GMT","uniqueSlug":"https://medium.com/codestar-blog/sharing-is-caring-domain-objects-in-both-scala-and-r-with-graalvm-polyglot-bindings-b561e8cfbcfa?source=rss----ea5cff13e3c9---4","paragraphs":"

In any domain that goes beyond a sample project, it becomes almost inevitable that you want to use objects that accurately represent that domain. GraalVM does an adequate job of converting datastructures from R to JVM languages and back by using sensible defaults, but what do you do when the sensible defaults are not sufficient? Given that GraalVM can perform translation between its multitude of supported languages, is it possible to define a “Domain” that can be accessed by all?

This is, of course, a rhetorical question and the answer is “Yes”.

\"\"

In this article I’ll demonstrate how to share domain objects between JVM languages and guest languages on the GraalVM platform. I’m using Scala domain objects (because Scala is awesome), but you could do the same with, for instance, Java or Kotlin.

(If you’re new to GraalVM Polyglot abilities, consider also reading my previous article on the subject: using GraalVM to execute R files from Scala.)

The Problem

To demonstrate the problem we are trying to solve, we first need a pretend domain. Let’s do something with Weather Forecasts, because people always talk about the weather!

Creating weather forecasts is the kind of terribly complicated modelling business that could be built in R, but luckily we don’t actually need a working model for this article. So let’s just pretend we already have this awesome R functionality that creates weather forecasts, cleanly abstracted away in a separate file called fun_MagicHappensHere.R:

When brought into scope with R’ssource the above file will yield a magicHappensHere function that can be called and returns a data.frame with some weather forecast information. We can then return the result to Scala by simply making it the return of our R function:

Wow, that doesn’t look too bad! This won’t get many complaints from the Data Scientist, I reckon.

So, what’s wrong with this? What’s the problem?

I’m glad you asked, interlocutor! Let’s take a look on the Scala/JVM side of this equation, to see what the Data Engineer has to deal with:

Whoa… creating the Graal Context and Source is trivial, but look at the nasty type signature on that call to R! Let’s pick it apart for a bit:

Let’s see what this means when we try to use the output of this function:

I don’t know about you, but I’d feel quite uncomfortable at the thought of maintaining the code above. It’s verbose, error prone, brittle, annoying and it fails at the wrong spot if any mistakes are introduced (namely at the place of conversion, rather than the place of programming error). I wish the R function would just return a Set of WeatherForecast!

Whoops, hold on… Wait a minute…

Why don’t we just make it do that?

The Solution: Bindings

GraalVM comes with an option that makes it possible to explicitly share instances of code across the language divide. It makes it possible to add symbols to bindings that are accessible to other languages. The Graal Context has two functions that can be used to do this in a very similar way:

In this article I will be using getBindings, because it doesn’t require an explicit import on the side of the using language and it allows you to limit which languages you are exposing each binding to. Using getPolyglotBindings() is almost identical from a coding perspective though, so pick the one you like best.

Using Domain objects on both sides of the language divide

This is what our Domain object looks like:

Domain is basically a factory that can be used to spawn new instances of all the domain classes that we want to share. The classDomain itself is immutable! (As it happens, the spawned instances are too.)

WARNING: You probably don’t want to put a mutable object into bindings. If you do, this object can be mutated from any language that can reach it. Just as you don’t want multiple threads to tangle with the same mutable object, you don’t want multiple languages to access the same mutable state! (Really! Imagine having to debug race conditions across language boundaries...)

Any instance of the Domain class provides methods to spawn new instances of the following domain case classes:

Let’s put an instance of our Domain class into the bindings for R, so it can be accessed from the R guest language context:

Easy peasy. From R, the new object will simply be known as Domain and its methods will be accessible like this: Domain$methodName(arguments)

We turn a new R file, that uses this binding, into our newest Source:

And then we define the function:

Now that this is our return type, all we need to do to work with the returned WeatherForecasts is this:

That is one very happy Data Engineer! (Don’t forget to compare with the incomplete parsing above.)

Now, let’s see the impact on the DataScientist side:

As we can see, the code has become more verbose (although it’s actually quite efficient still, if you take out all the clarifying comments I put in), but not quite as bad as in the previous solution:

In this R file, we now need to convert the data.frame to proper WeatherForecast instances to be added to the WeatherForecastList we also got from Domain. But rather than doing a Parse & Pray, as we had to do with the no-bindings solution, we can now use proper constructors that will fail with intelligible errors if we make a mistake. (Sadly still only at runtime, because this is still R.) Cleanly taking values out of the data.frame is also better supported by its native language and we could add more convenience methods to more succinctly create the domain classes if we wanted to. If we have direct control over the function that creates the weather forecasts, we can even skip the data.frame altogether and exclusively use WeatherForecastList, which eliminates the extra code seen above.

The biggest advantage, though, is that we now have a very clearly defined interface. Any user can open up the Domain.scala file to see what methods are available, what parameters they take and what things they return.

Conclusion

Using Bindings to provide a clean shared domain between guest languages (like R or Python) and JVM languages (like Scala, Java or Kotlin) in GraalVM is pretty easy and gets rid of a lot of ugly and fault-sensitive parsing. It also provides a crucial stepping stone for further integration of functionalities across language boundaries.

PS: I could have added a factory for each separate domain class to the bindings, instead of giving them a shared factory. This can make the code on the R side a little shorter, but creates a less clean interface (at least to my taste).

Sourcecode

I have reused the example project from my previous article on using GraalVM to execute R files from Scala) and branched it for this article. The source code can be found here. The snippets above are taken from the linked project and altered to better fit the sizing of the article.

\"\"

Sharing is Caring! Domain objects in BOTH Scala and R with GraalVM Polyglot bindings. was originally published in Codestar blog on Medium, where people are continuing the conversation by highlighting and responding to this story.

"},{"id":"https://medium.com/p/cd7456268dc5","title":"Using generative art to create a pulsating SVG star","author":"Hamza Haiken","latestPublishedAt":"Fri, 12 Apr 2019 09:39:17 GMT","uniqueSlug":"https://medium.com/codestar-blog/using-generative-art-to-create-a-pulsating-svg-star-cd7456268dc5?source=rss----ea5cff13e3c9---4","paragraphs":"

Part 1 — Intro

I recently created a new design for our recruitment campaign at Codestar. It represents a burning star, with corona-like features, represented in an abstract way, aiming to make it feel like a pulsating stream of data (The original artist for the star is Garry Killian).

\"\"
We’re very big on only hiring Latin speakers

The rest of the team enjoyed it, and we nicknamed this design “the code star”. It was then suggested that we could try and recreate this as an animation for our website, or to simply just to generate as many different static stars as we want: a teammate’s name could be used as a random seed, and they would be given their own special code star.

In this series of blog posts, I will endeavor to explain my process in taking on this challenge, going through various subjects, in particular generative art and SVG animation.

Our goal in this series will be to re-create the above visual in SVG, and animate it to make it slowly pulsate, like the sun’s corona.

What is generative art?

The term “generative art” (or also “procedural art”) refers the making of art algorithmically, typically relying on fractals and randomness.

Famous examples of this include: that one album cover that everybody wears on a t-shirt, Minecraft’s infinitely expanding worlds, No Man’s Sky’s universe and planets, and many more.

For further learning about getting started in generative art (after reading this of course!), I recommend as starting points Generative Artistry and The Coding Train YouTube channel, which often takes on generative art challenges.

Noise

One commonly used tool in the field of generative art is noise — in particular, Perlin, or Simplex noise (which is more suited for animations since it has a lower overhead). It is used for a variety of results: terrain, smoke, clouds, textures.

This kind of noise is obtained by overlaying noise at different frequencies on top of each other, forming a cloud-like texture that expands infinitely in any direction. The nice thing about this method of constructing noise is that it can be expanded to support any number of required dimensions (in our case, a 3D space).

In a nutshell, Perlin noise is constructed by averaging noise rendered at several scales (bilinear interpolation is used to smooth out the lower frequencies):

\"\"
Image source: https://medium.com/100-days-of-algorithms/day-88-perlin-noise-96d23158a44c

When averaging all of these (using some kind of weighted distribution), the following natural, cloudy texture is obtained:

\"\"
Could this image just be the “cloud” filter in Photoshop? Who knows

Used creatively, this noise can be used to create impressive results, like this wood texture for example (and again, given the nature of Perlin noise, this texture can expand seamlessly in any direction).

\"\"
Sitting atop a mathematically generated hill is a big dream of mine

And here is an example from the game “No Man’s Sky”. The mountains in such a landscape are created using low-frequency noise (big features), the smaller hills on top of that come from the middle range of noise frequencies, and if you zoom in even closer the small dirt bumps are added on top of the hills by adding in the values of a higher frequency (this is like a fractal). Additionally, the noise formula can also be (and was) manipulated in such a way as to seamlessly wrap around a sphere.

Using noise

One of the big advantages of Perlin noise: by traveling along its plane, the intensity values increase and decrease continuously. This is not only very useful for terrain generation for creating hills and valleys, but also for animation, providing offsets that will smoothly increase or decrease randomly in a natural way.

We will use simplex-noise.js for generating our noise. This is not Perlin but Simplex noise; it looks less detailed, and is faster to compute. The library provides a simple API: just instantiate a noise object with a random seed, which you can then use for getting noise values in 2D, 3D or 4D:

let simplex = new SimplexNoise(\"tutorial seed\");
let value = simplex.noise2D(0.42, 13.37);

Precision can be as small as needed, effectively zooming in on the noise, and the whole 2D plane that can be represented with JavaScript numbers is available to us.

Here is a simple demo on how to use Simplex noise. Feel free to play around with the sliders, particularly with the z-axis (slowly).

Moving along the X- and Y-axes feels natural to us humans — it just looks like standard translation — but it shows us that the noise is indeed continuous.

Moving along the Z-axis, however, gives a totally different feeling, exposing the vertical continuity of the noise by showing us slices of what seems to be an animation.

The color values at a given pixel coordinates change continuously and smoothly while navigating along the Z direction.

This is a big clue; by using the Z-axis to represent time, we can now animate things.

But before we can animate, we will first need a drawing!

Coming up in this series

Stick around on the Codestar blog to catch the next parts in this series:

\"\"

Using generative art to create a pulsating SVG star was originally published in Codestar blog on Medium, where people are continuing the conversation by highlighting and responding to this story.

"}],"upcomingMeetups":[],"pastMeetups":[{"created":1697454939000,"duration":14400000,"id":"296766473","name":"Workshop Red Hat Ansible Lightspeed and other Ansible development tools","date_in_series_pattern":false,"status":"past","time":1701351000000,"local_date":"2023-11-30","local_time":"14:30","rsvp_open_offset":"PT24H","updated":1701371524000,"utc_offset":3600000,"waitlist_count":0,"yes_rsvp_count":1,"is_online_event":false,"eventType":"PHYSICAL","group":{"created":1465915067000,"name":"Codestar Night","id":20072875,"join_mode":"open","lat":52.099998474121094,"lon":5.110000133514404,"urlname":"Codestar-Night","who":"Codestars","localized_location":"Utrecht, Netherlands","state":"","country":"nl","region":"en_US","timezone":"Europe/Amsterdam"},"link":"https://www.meetup.com/codestar-night/events/296766473/","description":"

You can sign up right now via this link: [https://www.ordina.com/insights/events/red-hat-openshift-workshop-2/](https://www.ordina.com/insights/events/red-hat-openshift-workshop-2/)

Recently Ansible Lightspeed has been introduced by Red Hat as an addition to existing developer tools in Ansible. Ansible Lightspeed (including IBM Watson Code Assistant) is a generative AI tool which makes it easier for developers to automate tasks in Ansible playbooks and create Ansible content. This session led by a Red Hat instructor is themed around \"A day in the life of an (Ansible) software developer\" and is focusing on tools that can help developers to create and improve Ansible playbooks in an efficient way.

**Agenda**

* 14:30 - 15:00: Registration
* 15:00 - 16:00: A day in the life of an Ansible developer
* 16:00 - 18:15: Labs
* 18:15- 18:30: Closure

**When** : November 30th 2023 van 15:00-19:00
**Where** : Ringwade 1, Nieuwegein
**Who** : Software developers, Cloud Engineers and DevOps Engineers
**What** : Bring your own laptop.

","visibility":"public","member_pay_fee":false,"featured_photo":{"id":516608243,"highres_link":"https://secure.meetupstatic.com/photos/event/2/0/3/3/highres_516608243.jpeg","photo_link":"https://secure.meetupstatic.com/photos/event/2/0/3/3/600_516608243.jpeg","thumb_link":"https://secure.meetupstatic.com/photos/event/2/0/3/3/thumb_516608243.jpeg","type":"event","base_url":"https://secure.meetupstatic.com"}},{"created":1698310263000,"duration":10800000,"id":"296966454","name":"Codesmiths Unite ","date_in_series_pattern":false,"status":"past","time":1700755200000,"local_date":"2023-11-23","local_time":"17:00","updated":1700771768000,"utc_offset":3600000,"waitlist_count":0,"yes_rsvp_count":8,"venue":{"id":26404459,"name":"Ringwade 1","lat":52.057823181152344,"lon":5.111423015594482,"repinned":true,"address_1":"Ringwade 1","city":"Nieuwegein","country":"nl","localized_country_name":"Netherlands"},"is_online_event":false,"eventType":"PHYSICAL","group":{"created":1465915067000,"name":"Codestar Night","id":20072875,"join_mode":"open","lat":52.099998474121094,"lon":5.110000133514404,"urlname":"Codestar-Night","who":"Codestars","localized_location":"Utrecht, Netherlands","state":"","country":"nl","region":"en_US","timezone":"Europe/Amsterdam"},"link":"https://www.meetup.com/codestar-night/events/296966454/","description":"

**Details**
Ordina Codesmiths stand for a shared passion in Software Engineering and knowledge sharing.
Join us on the 23rd of November and meet your peer developers and hear interesting learnings on topics as Cloud, Security, Frontend, Mobile and testing.

**Program:**
**Walk in 17:00**
**Buffet and drinks 17:15**
**Opening 18:00**
**Talk 1 18:10 - 18:35**
Frederieke Scheper - Kubernetes deployment done right
**Talk 2 18:40 - 19:05**
Rick Hutten - Simplifying Concurrency
**Break**
**Talk 3 19:20 - 19:45**
Kaya Weers - Design patterns
**Drinks 19:45**

**About the talks and presenters**

**Frederieke Scheper**
**Helm - Kubernetes deployments done right**
Instead of steering into the murky waters of unmaintainable copy-pasted Kubernetes YAML files, let’s take the Helm and let it manage all your Kubernetes deployments, from a simple Spring Boot microservice to the most complex Kubernetes application! In this presentation, I will show you how easy it is to create, version, share, and publish Helm Charts. So, start using Helm and stop the copy-and-pasting. Along the way, you will discover the real benefits that lay in the role it plays in streamlining your CI/CD pipelines. Helm automatically maintains a database of all the versions of your releases. So, whenever something goes wrong during deployment, rolling back to the previous version is just one command away. So, let’s take a deep dive into Helm charts, templates, and functions: Kubernetes deployments done right!

**Rick Hutten**
**Simplifying Concurrency with Project Loom: A Journey with Pizza-chef Fabio**
Project Loom, a groundbreaking feature within OpenJDK, introduces a lightweight and versatile concurrency model for Java. Understanding concurrency can be challenging, especially for non-technical individuals and novice developers. In this session, we embark on an adventure alongside Fabio, a passionate pizza-chef facing similar challenges in his upscale restaurant as those encountered in multithreading on a CPU. We delve into concepts such as CPU threads, virtual threads, and structured concurrency, making them accessible to listeners of all proficiency levels. Attendees will not only learn to recognize the use cases of these techniques but also gain insights into how and if Project Loom can enhance their application.

**Kaya Weers**
**A design pattern goes to the supermarket**
Everybody knows the term design patterns. Some know the patterns and correct implementation by heart. Others vaguely recognize the pattern names but don’t recall the details. This talk is intended for the latter group.
I’ll dive into a couple of design patterns using real-life examples. What would a design pattern look like in day-to-day life? We’ll follow Bobby and Billie and discover how a design pattern would behave in a non-digital environment: the supermarket! With the help of drawings, this talk will give you a solid understanding of design patterns, so you won't have to look them up ever again!

","visibility":"public","member_pay_fee":false,"featured_photo":{"id":516824538,"highres_link":"https://secure.meetupstatic.com/photos/event/a/d/f/a/highres_516824538.jpeg","photo_link":"https://secure.meetupstatic.com/photos/event/a/d/f/a/600_516824538.jpeg","thumb_link":"https://secure.meetupstatic.com/photos/event/a/d/f/a/thumb_516824538.jpeg","type":"event","base_url":"https://secure.meetupstatic.com"}},{"created":1698153898000,"duration":14400000,"id":"296928992","name":"Tech Women Connect","date_in_series_pattern":false,"status":"past","time":1700751600000,"local_date":"2023-11-23","local_time":"16:00","updated":1700771737000,"utc_offset":3600000,"waitlist_count":0,"yes_rsvp_count":17,"venue":{"id":24315864,"name":"Ordina HQ ","lat":52.05641174316406,"lon":5.110540866851807,"repinned":true,"address_1":"Ringwade 1","city":"Nieuwegein","country":"nl","localized_country_name":"Netherlands"},"is_online_event":false,"eventType":"PHYSICAL","group":{"created":1465915067000,"name":"Codestar Night","id":20072875,"join_mode":"open","lat":52.099998474121094,"lon":5.110000133514404,"urlname":"Codestar-Night","who":"Codestars","localized_location":"Utrecht, Netherlands","state":"","country":"nl","region":"en_US","timezone":"Europe/Amsterdam"},"link":"https://www.meetup.com/codestar-night/events/296928992/","description":"

On the 23*rd* of November we are organizing the Tech Women Connect event at the Ordina office in Utrecht(Nieuwegein), it’s an inspiring gathering that celebrates and empowers women in the tech industry.

In the last four decades, there has been increasingly more attention on the participation of women in male-dominated sectors, such as IT — another milestone to celebrate. However, women in male-dominated careers still face challenges today.
Modern day workforces are moving in the right direction, yet many women are not experiencing the benefits. So how can individual women continue and accelerate to thrive in male-dominated industries?
Perhaps the best approach is to ask individual women who have done it…

Here’s what you can look forward to:

**Valuable Insights:** *Gain priceless insights from accomplished women in tech. Learn from their experiences, achievements, and challenges, and discover how you can succeed and thrive in the tech industry.*
**Networking Opportunities:** *Connect with remarkable tech women, industry leaders, and like-minded professionals. Forge new connections, exchange ideas.*
**Exciting Games and Activities!**

**Event Details:**
Date: November 23, 2023
Time: 16:00 – 20:00
Venue: A12.06 AUDITORIUM, Ringwade 1, Nieuwegein

**Program Schedule:**

* **16:00 – 16:40: Keynote Speaker (Stacy Cashmore – “My Journey into Speaking”)** *Join us as we kick off the evening with an engaging keynote address from a prominent tech women who will share her remarkable journey into the world of public speaking. Get ready to be inspired by her insights and experiences.*
* **17:00 – 18:00: Panel Discussion – “Tech Women in a Male-Dominated Culture”** *Our panel of women tech experts will engage in a discussion on the challenges and triumphs of women working in male-dominated environments.*
* **18:00 – 18:30: Keynote Speaker (Kaya Weers – “The Non-Typical Dev”)** *Our second keynote speaker will dive into the world of not fitting in the stereotypes and the importance of feeling like you belong.*
* **19:00 onwards: Dinner and Networking** – *it’s time to relax, connect, and enjoy small drinks and some snacks (vegetarian options included).*

**Note:** we have limited seats for external attendees. Please confirm and sign up as soon as possible to secure your seat. Once you receive a confirmation from our side you will be a confirmed guest to the event..

**How to get there?**

**Public transport**
At Utrecht Centraal, take BUS 65/74/77 or Tram 60, both stop at Westraven, from there it’s a 5-10 min walk to the Ordina office.

**Car**
You have free parking outside the Ordina office (Ringwade 1, Nieuwegein)

","visibility":"public","member_pay_fee":false,"featured_photo":{"id":516794606,"highres_link":"https://secure.meetupstatic.com/photos/event/3/9/0/e/highres_516794606.jpeg","photo_link":"https://secure.meetupstatic.com/photos/event/3/9/0/e/600_516794606.jpeg","thumb_link":"https://secure.meetupstatic.com/photos/event/3/9/0/e/thumb_516794606.jpeg","type":"event","base_url":"https://secure.meetupstatic.com"}},{"created":1696248935000,"duration":10800000,"id":"296486807","name":"Ordina Frontend Community presents: Back to basics panel discussion","rsvp_limit":15,"date_in_series_pattern":false,"status":"past","time":1697729400000,"local_date":"2023-10-19","local_time":"17:30","rsvp_close_offset":"PT72H30M","updated":1697749352000,"utc_offset":7200000,"waitlist_count":0,"yes_rsvp_count":5,"venue":{"id":26404459,"name":"Ringwade 1","lat":52.057823181152344,"lon":5.111423015594482,"repinned":true,"address_1":"Ringwade 1","city":"Nieuwegein","country":"nl","localized_country_name":"Netherlands"},"is_online_event":false,"eventType":"PHYSICAL","group":{"created":1465915067000,"name":"Codestar Night","id":20072875,"join_mode":"open","lat":52.099998474121094,"lon":5.110000133514404,"urlname":"Codestar-Night","who":"Codestars","localized_location":"Utrecht, Netherlands","state":"","country":"nl","region":"en_US","timezone":"Europe/Amsterdam"},"link":"https://www.meetup.com/codestar-night/events/296486807/","description":"

**Back to basics panel discusison**
Ordina's Frontend Community would like to present to you an open and interactive discussion about the world of frontend. We'll talk about *\"How we've gotten here and where it is going\".*

Come and join us to have a chat about how complex the world of modern front end development has become, trends we see returning from the past and how this all affects our daily jobs as frontend developers.

Topics like:

* **Have our tools** been focussed too much on **Developer Experience**, instead of the **User**?
\\- What **benefits** do our **modern stacks** have, and **for who** are these benefits?

And more, we're **taking** your **suggestions**!

https://forms.office.com/e/dLK7MbgHm6

**Programme**
**17:30 Walk-in, dinner & drinks**
A diverse dinner will be served, any dietary preferences or restrictions can be mentioned in the signup form.

**18:45 Introductions of our panelists**
We'll move to the main venue room and open with a short introduction of our panelists and their diverse experiences.

**19:00 Panel discussion**
Kick off the panel discussion with some topics, suggested by **you**! Use the signup form to add your ideas/controversial topics or other suggestions to the discussion up front!

**20:00 Closing & Drinks**
After a good hour of chatting about a diverse range of prepared topics and questions, we'll close the main room. There'll be plenty of opportunity to continue any discussions or conversations with a drink and snack before we close the venue for the day.

This event will be cross posted on Meetup.com and internally to Ordina colleagues. Therefore there will be a stricter limit on amount of registrations for this specific event.

","how_to_find_us":"By bicycle: Plenty of parking room for bicycles at the front door.\nBy public transport: Tramlines 20 & 21 stop within a short walk's distance\nBy car: Free parking in front of the building","visibility":"public","member_pay_fee":false,"featured_photo":{"id":516309713,"highres_link":"https://secure.meetupstatic.com/photos/event/2/5/f/1/highres_516309713.jpeg","photo_link":"https://secure.meetupstatic.com/photos/event/2/5/f/1/600_516309713.jpeg","thumb_link":"https://secure.meetupstatic.com/photos/event/2/5/f/1/thumb_516309713.jpeg","type":"event","base_url":"https://secure.meetupstatic.com"}},{"created":1693462430000,"duration":14400000,"id":"295795991","name":"Creating UI libraries by utilizing Storybook, ReactJs, NPM and Azure.","date_in_series_pattern":false,"status":"past","time":1695913200000,"local_date":"2023-09-28","local_time":"17:00","updated":1695935924000,"utc_offset":7200000,"waitlist_count":0,"yes_rsvp_count":2,"venue":{"id":24315864,"name":"Ordina HQ ","lat":52.05641174316406,"lon":5.110540866851807,"repinned":true,"address_1":"Ringwade 1","city":"Nieuwegein","country":"nl","localized_country_name":"Netherlands"},"is_online_event":false,"eventType":"PHYSICAL","group":{"created":1465915067000,"name":"Codestar Night","id":20072875,"join_mode":"open","lat":52.099998474121094,"lon":5.110000133514404,"urlname":"Codestar-Night","who":"Codestars","localized_location":"Utrecht, Netherlands","state":"","country":"nl","region":"en_US","timezone":"Europe/Amsterdam"},"link":"https://www.meetup.com/codestar-night/events/295795991/","description":"

Sign up for this event here: [https://www.meetup.com/utrecht-frontend-meetup/events/295531915/](https://www.meetup.com/utrecht-frontend-meetup/events/295531915/)

If you have ever attempted to extract your UI libraries into an abstract package which can be consumed just like any other NPM package. You’ll probably have encountered quite a few hurdles. For example:

1. How do I build the code, do I use CJS or ESM?

2. How do I ensure code quality?

3. How do I actually publish an NPM package?

4. Can the publishing of packages be automated by CI/CD?

5. How do I provide interactive documentation like Bootstrap or Material UI?

If you have ever encountered or wondered about these questions this workshop is for you. We will set up a Storybook Application, unit test it, publish it via CI/CD, containerize it with Docker, publish our container to Azure Container Registry and finally publish the container to an Azure web app.

The workshop will be hosted on the 28*th* of September 17:00 - 21:00, food and drinks are included!

Pre-requisites: Some experience with JavaScript. Any CI/CD experience will help but is not necessary.

A github Repo will be available for reference.

","visibility":"public","member_pay_fee":false,"featured_photo":{"id":515525035,"highres_link":"https://secure.meetupstatic.com/photos/event/1/3/a/b/highres_515525035.jpeg","photo_link":"https://secure.meetupstatic.com/photos/event/1/3/a/b/600_515525035.jpeg","thumb_link":"https://secure.meetupstatic.com/photos/event/1/3/a/b/thumb_515525035.jpeg","type":"event","base_url":"https://secure.meetupstatic.com"}},{"created":1695301754000,"duration":21600000,"id":"296251627","name":"Workshop Red Hat OpenShift","date_in_series_pattern":false,"status":"past","time":1695812400000,"local_date":"2023-09-27","local_time":"13:00","updated":1695841163000,"utc_offset":7200000,"waitlist_count":0,"yes_rsvp_count":1,"venue":{"id":24315864,"name":"Ordina HQ ","lat":52.05641174316406,"lon":5.110540866851807,"repinned":false,"address_1":"Ringwade 1","city":"Nieuwegein","country":"nl","localized_country_name":"Netherlands"},"is_online_event":false,"eventType":"PHYSICAL","group":{"created":1465915067000,"name":"Codestar Night","id":20072875,"join_mode":"open","lat":52.099998474121094,"lon":5.110000133514404,"urlname":"Codestar-Night","who":"Codestars","localized_location":"Utrecht, Netherlands","state":"","country":"nl","region":"en_US","timezone":"Europe/Amsterdam"},"link":"https://www.meetup.com/codestar-night/events/296251627/","description":"

Free registration is open @ [https://www.ordina.com/insights/events/red-hat-openshift-workshop/](https://www.ordina.com/insights/events/red-hat-openshift-workshop/)
***Note that the registration process goes via the website above as we need to setup a lab environment specifically for you. Please keep in mind that with a no-show you're potentially taking someone else's spot.***
Participate in our journey into the world of cloud-native application development and deployment. Embrace the efficiency of cloud-native CI/CD pipelines with Openshift and learn how to streamline your application lifecycle management with OpenShift GitOps. With two dynamic workshops on 27 September led by an experienced Red Hat instructor focusing on OpenShift Pipelines and OpenShift GitOps, you can gain hands-on skills and insights that enable you to stay ahead in the rapidly evolving landscape of cloud-native technology.
**Program:**
**Walk in 14:30 - 15:00 hrs**
**Introduction Red Hat and OpenShift 15:00 - 16:00 hrs**
**Labs 16:00 - 18:30 hrs**

* *1- Introduction Openshift pipelines*

OpenShift Pipelines is a cloud-native, CI/CD delivery solution to build pipelines on OpenShift using Tekton.
* 2- *OpenShift GitOps*

Start using OpenShift GitOps and start deployments with Red Hat OpenShift GitOps (based on ArgoCD) and use Kustomize, sync waves, and hooks.

**Closure 18:30 - 19:00 hrs**
Don't miss this chance to elevate your technical expertise and reserve your spot now for our upcoming Red Hat OpenShift workshop on September 27th and get up to speed in the world of modern application development and operations.
***Don't forget to bring your own laptop!***

","visibility":"public","member_pay_fee":false},{"created":1681909979000,"duration":12600000,"id":"292995726","name":"AI Hackathon","date_in_series_pattern":false,"status":"past","time":1688052600000,"local_date":"2023-06-29","local_time":"17:30","updated":1688072986000,"utc_offset":7200000,"waitlist_count":0,"yes_rsvp_count":4,"venue":{"id":24315864,"name":"Ordina HQ ","lat":52.05641174316406,"lon":5.110540866851807,"repinned":true,"address_1":"Ringwade 1","city":"Nieuwegein","country":"nl","localized_country_name":"Netherlands"},"is_online_event":false,"eventType":"PHYSICAL","group":{"created":1465915067000,"name":"Codestar Night","id":20072875,"join_mode":"open","lat":52.099998474121094,"lon":5.110000133514404,"urlname":"Codestar-Night","who":"Codestars","localized_location":"Utrecht, Netherlands","state":"","country":"nl","region":"en_US","timezone":"Europe/Amsterdam"},"link":"https://www.meetup.com/codestar-night/events/292995726/","description":"

**AI Hackathon,** by Ordina's Frontend Guild
\"Attention developers and all AI enthusiasts! Are you looking for an exciting and spontaneous challenge that will put your coding skills to the test? Then join us for a ChatGPT hackathon where you'll have two hours to create a functional and practical application using ChatGPT's natural language processing capabilities. Whether you're a seasoned developer or new to AI, this is your chance to show off your skills and creativity in a fast-paced and dynamic environment. So come as you are and see what you can accomplish with ChatGPT by your side!.\"

**Program:**
**Walk in                        17:30 hrs**
**Grab some food and drinks    18:00 hrs**
Start Hackathon 18:15 hrs

","visibility":"public","member_pay_fee":false}],"toots":{"data":[{"id":"109318878709762915","created_at":"2022-11-10T09:48:30.790Z","url":"https://mastodon.social/@codestar/109318878709762915","text":"Join us on the 24th of november for a Robotics workshop at the Ordina office!!!\n\nFREE registration through the link below and join us for an evening with a great developer community, lots of fun and challenging\nassignments. Looking forward to seeing you there!!\n\nhttps://docs.google.com/forms/d/e/1FAIpQLScausKDt8EA1TFds04ghHKXQ2cMeJHDt019nn1X0obOD3InvA/viewform\n\nSee the trailer here: https://www.linkedin.com/posts/rickyvanrijn_azure-ros2-cloud-activity-6996406427263082496-e1fX\n\n#azure #ros2 #cloud #robotics #ordina #workshop #ros #fun","replies_count":0,"reblogs_count":1,"favourites_count":1},{"id":"109312667568153179","created_at":"2022-11-09T07:28:56.284Z","url":"https://mastodon.social/@codestar/109312667568153179","text":"Join our meetup on 1 December with @StacyClouds about #Azure Web Apps with #Blazor!\nhttps://www.meetup.com/codestar-night/events/289022760/","replies_count":0,"reblogs_count":1,"favourites_count":1}],"author":{"username":"codestar","url":"https://mastodon.social/@codestar"}},"tweets":null,"playlist":[{"id":"v8rFXbLV03Q","publishedAt":"Fri May 20 2022 08:55:14 GMT+0000 (Coordinated Universal Time)","title":"Met moderne technologie bouwen aan een duurzame software-oplossing","description":["Vandebron heeft in samenwerking met Ordina en KPN,een oplossing bedacht, waarbij de drie partijen hun kennis en expertise op het gebied van zonne-energie, software-ontwikkeling, data-connectiviteit en Internet of Things met elkaar hebben gedeeld.","","Wil jij ook ‘ahead of change’ zijn? Ga naar https://www.ordina.com voor meer informatie. ","","Meer te weten komen over Ordina? Volg dan onze socials!","LinkedIn: https://nl.linkedin.com/company/ordina ","Instagram: https://www.instagram.com/ordinabenelux/"],"thumbnails":{"default":{"url":"https://i.ytimg.com/vi/v8rFXbLV03Q/default.jpg","width":120,"height":90},"medium":{"url":"https://i.ytimg.com/vi/v8rFXbLV03Q/mqdefault.jpg","width":320,"height":180},"high":{"url":"https://i.ytimg.com/vi/v8rFXbLV03Q/hqdefault.jpg","width":480,"height":360},"standard":{"url":"https://i.ytimg.com/vi/v8rFXbLV03Q/sddefault.jpg","width":640,"height":480},"maxres":{"url":"https://i.ytimg.com/vi/v8rFXbLV03Q/maxresdefault.jpg","width":1280,"height":720}}},{"id":"yWV1eOozlOQ","publishedAt":"Tue Nov 09 2021 10:12:14 GMT+0000 (Coordinated Universal Time)","title":"Ordina Codestar at Port Of Rotterdam","description":["Our Ordina Codestar colleagues talk about their experience at the PortXchange project at the Port of Rotterdam"],"thumbnails":{"default":{"url":"https://i.ytimg.com/vi/yWV1eOozlOQ/default.jpg","width":120,"height":90},"medium":{"url":"https://i.ytimg.com/vi/yWV1eOozlOQ/mqdefault.jpg","width":320,"height":180},"high":{"url":"https://i.ytimg.com/vi/yWV1eOozlOQ/hqdefault.jpg","width":480,"height":360},"standard":{"url":"https://i.ytimg.com/vi/yWV1eOozlOQ/sddefault.jpg","width":640,"height":480},"maxres":{"url":"https://i.ytimg.com/vi/yWV1eOozlOQ/maxresdefault.jpg","width":1280,"height":720}}},{"id":"tSesmVPwKZk","publishedAt":"Wed Oct 27 2021 09:01:42 GMT+0000 (Coordinated Universal Time)","title":"Ordina's draagt bij aan duurzame doelen van Havenbedrijf Rotterdam","description":["Maatschappelijke verantwoordelijkheid en duurzaamheid wordt steeds belangrijker bij onze klanten. Wij dragen hieraan bij door versnelling te brengen in transformatieprocessen. Een voorbeeld hiervan is het project voor het Havenbedrijf Rotterdam. ","","Een duurzame oplossing voor jouw bedrijf? Ga naar https://www.ordina.com voor alle mogelijkheden.","","Meer te weten komen over Ordina? Volg dan onze socials!","LinkedIn: https://nl.linkedin.com/company/ordina ","Instagram: https://www.instagram.com/ordinabenelux/"],"thumbnails":{"default":{"url":"https://i.ytimg.com/vi/tSesmVPwKZk/default.jpg","width":120,"height":90},"medium":{"url":"https://i.ytimg.com/vi/tSesmVPwKZk/mqdefault.jpg","width":320,"height":180},"high":{"url":"https://i.ytimg.com/vi/tSesmVPwKZk/hqdefault.jpg","width":480,"height":360},"standard":{"url":"https://i.ytimg.com/vi/tSesmVPwKZk/sddefault.jpg","width":640,"height":480},"maxres":{"url":"https://i.ytimg.com/vi/tSesmVPwKZk/maxresdefault.jpg","width":1280,"height":720}}},{"id":"EaQt031BByw","publishedAt":"Tue Jun 01 2021 06:49:14 GMT+0000 (Coordinated Universal Time)","title":"Martin van Es - GraphQL for the Lazy Developer","description":["Codestar Night @ Home \"generate code.*\" from 27 May 2021","Also see https://www.meetup.com/Codestar-Night/events/277737066/","","Example application mentioned at the end: https://github.com/mdvanes/7sgraph"],"thumbnails":{"default":{"url":"https://i.ytimg.com/vi/EaQt031BByw/default.jpg","width":120,"height":90},"medium":{"url":"https://i.ytimg.com/vi/EaQt031BByw/mqdefault.jpg","width":320,"height":180},"high":{"url":"https://i.ytimg.com/vi/EaQt031BByw/hqdefault.jpg","width":480,"height":360}}},{"id":"Uq5Y080Por0","publishedAt":"Tue Jun 01 2021 06:46:30 GMT+0000 (Coordinated Universal Time)","title":"Bart Kuijper - The Power of Demystifying Your Stack","description":["Codestar Night @ Home \"generate code.*\" from 27 May 2021","Also see https://www.meetup.com/Codestar-Night/events/277737066/"],"thumbnails":{"default":{"url":"https://i.ytimg.com/vi/Uq5Y080Por0/default.jpg","width":120,"height":90},"medium":{"url":"https://i.ytimg.com/vi/Uq5Y080Por0/mqdefault.jpg","width":320,"height":180},"high":{"url":"https://i.ytimg.com/vi/Uq5Y080Por0/hqdefault.jpg","width":480,"height":360},"standard":{"url":"https://i.ytimg.com/vi/Uq5Y080Por0/sddefault.jpg","width":640,"height":480},"maxres":{"url":"https://i.ytimg.com/vi/Uq5Y080Por0/maxresdefault.jpg","width":1280,"height":720}}}]},"__N_SSG":true} \ No newline at end of file diff --git a/_next/data/TnaEdhvUAqE4h18cinFPy/events.json b/_next/data/TnaEdhvUAqE4h18cinFPy/events.json deleted file mode 100644 index d38c784..0000000 --- a/_next/data/TnaEdhvUAqE4h18cinFPy/events.json +++ /dev/null @@ -1 +0,0 @@ -{"pageProps":{"pastMeetups":[{"created":1696248935000,"duration":10800000,"id":"296486807","name":"Ordina Frontend Community presents: Back to basics panel discussion","rsvp_limit":15,"date_in_series_pattern":false,"status":"past","time":1697729400000,"local_date":"2023-10-19","local_time":"17:30","rsvp_close_offset":"PT72H30M","updated":1697749352000,"utc_offset":7200000,"waitlist_count":0,"yes_rsvp_count":5,"venue":{"id":26404459,"name":"Ringwade 1","lat":52.057823181152344,"lon":5.111423015594482,"repinned":true,"address_1":"Ringwade 1","city":"Nieuwegein","country":"nl","localized_country_name":"Netherlands"},"is_online_event":false,"eventType":"PHYSICAL","group":{"created":1465915067000,"name":"Codestar Night","id":20072875,"join_mode":"open","lat":52.099998474121094,"lon":5.110000133514404,"urlname":"Codestar-Night","who":"Codestars","localized_location":"Utrecht, Netherlands","state":"","country":"nl","region":"en_US","timezone":"Europe/Amsterdam"},"link":"https://www.meetup.com/codestar-night/events/296486807/","description":"

**Back to basics panel discusison**
Ordina's Frontend Community would like to present to you an open and interactive discussion about the world of frontend. We'll talk about *\"How we've gotten here and where it is going\".*

Come and join us to have a chat about how complex the world of modern front end development has become, trends we see returning from the past and how this all affects our daily jobs as frontend developers.

Topics like:

* **Have our tools** been focussed too much on **Developer Experience**, instead of the **User**?
\\- What **benefits** do our **modern stacks** have, and **for who** are these benefits?

And more, we're **taking** your **suggestions**!

https://forms.office.com/e/dLK7MbgHm6

**Programme**
**17:30 Walk-in, dinner & drinks**
A diverse dinner will be served, any dietary preferences or restrictions can be mentioned in the signup form.

**18:45 Introductions of our panelists**
We'll move to the main venue room and open with a short introduction of our panelists and their diverse experiences.

**19:00 Panel discussion**
Kick off the panel discussion with some topics, suggested by **you**! Use the signup form to add your ideas/controversial topics or other suggestions to the discussion up front!

**20:00 Closing & Drinks**
After a good hour of chatting about a diverse range of prepared topics and questions, we'll close the main room. There'll be plenty of opportunity to continue any discussions or conversations with a drink and snack before we close the venue for the day.

This event will be cross posted on Meetup.com and internally to Ordina colleagues. Therefore there will be a stricter limit on amount of registrations for this specific event.

","how_to_find_us":"By bicycle: Plenty of parking room for bicycles at the front door.\nBy public transport: Tramlines 20 & 21 stop within a short walk's distance\nBy car: Free parking in front of the building","visibility":"public","member_pay_fee":false,"featured_photo":{"id":516309713,"highres_link":"https://secure.meetupstatic.com/photos/event/2/5/f/1/highres_516309713.jpeg","photo_link":"https://secure.meetupstatic.com/photos/event/2/5/f/1/600_516309713.jpeg","thumb_link":"https://secure.meetupstatic.com/photos/event/2/5/f/1/thumb_516309713.jpeg","type":"event","base_url":"https://secure.meetupstatic.com"}},{"created":1693462430000,"duration":14400000,"id":"295795991","name":"Creating UI libraries by utilizing Storybook, ReactJs, NPM and Azure.","date_in_series_pattern":false,"status":"past","time":1695913200000,"local_date":"2023-09-28","local_time":"17:00","updated":1695935924000,"utc_offset":7200000,"waitlist_count":0,"yes_rsvp_count":2,"venue":{"id":24315864,"name":"Ordina HQ ","lat":52.05641174316406,"lon":5.110540866851807,"repinned":true,"address_1":"Ringwade 1","city":"Nieuwegein","country":"nl","localized_country_name":"Netherlands"},"is_online_event":false,"eventType":"PHYSICAL","group":{"created":1465915067000,"name":"Codestar Night","id":20072875,"join_mode":"open","lat":52.099998474121094,"lon":5.110000133514404,"urlname":"Codestar-Night","who":"Codestars","localized_location":"Utrecht, Netherlands","state":"","country":"nl","region":"en_US","timezone":"Europe/Amsterdam"},"link":"https://www.meetup.com/codestar-night/events/295795991/","description":"

Sign up for this event here: [https://www.meetup.com/utrecht-frontend-meetup/events/295531915/](https://www.meetup.com/utrecht-frontend-meetup/events/295531915/)

If you have ever attempted to extract your UI libraries into an abstract package which can be consumed just like any other NPM package. You’ll probably have encountered quite a few hurdles. For example:

1. How do I build the code, do I use CJS or ESM?

2. How do I ensure code quality?

3. How do I actually publish an NPM package?

4. Can the publishing of packages be automated by CI/CD?

5. How do I provide interactive documentation like Bootstrap or Material UI?

If you have ever encountered or wondered about these questions this workshop is for you. We will set up a Storybook Application, unit test it, publish it via CI/CD, containerize it with Docker, publish our container to Azure Container Registry and finally publish the container to an Azure web app.

The workshop will be hosted on the 28*th* of September 17:00 - 21:00, food and drinks are included!

Pre-requisites: Some experience with JavaScript. Any CI/CD experience will help but is not necessary.

A github Repo will be available for reference.

","visibility":"public","member_pay_fee":false,"featured_photo":{"id":515525035,"highres_link":"https://secure.meetupstatic.com/photos/event/1/3/a/b/highres_515525035.jpeg","photo_link":"https://secure.meetupstatic.com/photos/event/1/3/a/b/600_515525035.jpeg","thumb_link":"https://secure.meetupstatic.com/photos/event/1/3/a/b/thumb_515525035.jpeg","type":"event","base_url":"https://secure.meetupstatic.com"}},{"created":1695301754000,"duration":21600000,"id":"296251627","name":"Workshop Red Hat OpenShift","date_in_series_pattern":false,"status":"past","time":1695812400000,"local_date":"2023-09-27","local_time":"13:00","updated":1695841163000,"utc_offset":7200000,"waitlist_count":0,"yes_rsvp_count":1,"venue":{"id":24315864,"name":"Ordina HQ ","lat":52.05641174316406,"lon":5.110540866851807,"repinned":false,"address_1":"Ringwade 1","city":"Nieuwegein","country":"nl","localized_country_name":"Netherlands"},"is_online_event":false,"eventType":"PHYSICAL","group":{"created":1465915067000,"name":"Codestar Night","id":20072875,"join_mode":"open","lat":52.099998474121094,"lon":5.110000133514404,"urlname":"Codestar-Night","who":"Codestars","localized_location":"Utrecht, Netherlands","state":"","country":"nl","region":"en_US","timezone":"Europe/Amsterdam"},"link":"https://www.meetup.com/codestar-night/events/296251627/","description":"

Free registration is open @ [https://www.ordina.com/insights/events/red-hat-openshift-workshop/](https://www.ordina.com/insights/events/red-hat-openshift-workshop/)
***Note that the registration process goes via the website above as we need to setup a lab environment specifically for you. Please keep in mind that with a no-show you're potentially taking someone else's spot.***
Participate in our journey into the world of cloud-native application development and deployment. Embrace the efficiency of cloud-native CI/CD pipelines with Openshift and learn how to streamline your application lifecycle management with OpenShift GitOps. With two dynamic workshops on 27 September led by an experienced Red Hat instructor focusing on OpenShift Pipelines and OpenShift GitOps, you can gain hands-on skills and insights that enable you to stay ahead in the rapidly evolving landscape of cloud-native technology.
**Program:**
**Walk in 14:30 - 15:00 hrs**
**Introduction Red Hat and OpenShift 15:00 - 16:00 hrs**
**Labs 16:00 - 18:30 hrs**

* *1- Introduction Openshift pipelines*

OpenShift Pipelines is a cloud-native, CI/CD delivery solution to build pipelines on OpenShift using Tekton.
* 2- *OpenShift GitOps*

Start using OpenShift GitOps and start deployments with Red Hat OpenShift GitOps (based on ArgoCD) and use Kustomize, sync waves, and hooks.

**Closure 18:30 - 19:00 hrs**
Don't miss this chance to elevate your technical expertise and reserve your spot now for our upcoming Red Hat OpenShift workshop on September 27th and get up to speed in the world of modern application development and operations.
***Don't forget to bring your own laptop!***

","visibility":"public","member_pay_fee":false},{"created":1681909979000,"duration":12600000,"id":"292995726","name":"AI Hackathon","date_in_series_pattern":false,"status":"past","time":1688052600000,"local_date":"2023-06-29","local_time":"17:30","updated":1688072986000,"utc_offset":7200000,"waitlist_count":0,"yes_rsvp_count":4,"venue":{"id":24315864,"name":"Ordina HQ ","lat":52.05641174316406,"lon":5.110540866851807,"repinned":true,"address_1":"Ringwade 1","city":"Nieuwegein","country":"nl","localized_country_name":"Netherlands"},"is_online_event":false,"eventType":"PHYSICAL","group":{"created":1465915067000,"name":"Codestar Night","id":20072875,"join_mode":"open","lat":52.099998474121094,"lon":5.110000133514404,"urlname":"Codestar-Night","who":"Codestars","localized_location":"Utrecht, Netherlands","state":"","country":"nl","region":"en_US","timezone":"Europe/Amsterdam"},"link":"https://www.meetup.com/codestar-night/events/292995726/","description":"

**AI Hackathon,** by Ordina's Frontend Guild
\"Attention developers and all AI enthusiasts! Are you looking for an exciting and spontaneous challenge that will put your coding skills to the test? Then join us for a ChatGPT hackathon where you'll have two hours to create a functional and practical application using ChatGPT's natural language processing capabilities. Whether you're a seasoned developer or new to AI, this is your chance to show off your skills and creativity in a fast-paced and dynamic environment. So come as you are and see what you can accomplish with ChatGPT by your side!.\"

**Program:**
**Walk in                        17:30 hrs**
**Grab some food and drinks    18:00 hrs**
Start Hackathon 18:15 hrs

","visibility":"public","member_pay_fee":false},{"created":1685982815000,"duration":10800000,"id":"293996924","name":"Ordina presents: Exploratory Testing | Navigating Through Uncharted Territory","date_in_series_pattern":false,"status":"past","time":1686668400000,"local_date":"2023-06-13","local_time":"17:00","rsvp_close_offset":"PT48H","updated":1686682027000,"utc_offset":7200000,"waitlist_count":0,"yes_rsvp_count":1,"venue":{"id":24315864,"name":"Ordina HQ ","lat":0,"lon":0,"repinned":true,"address_1":"Ringwade 1","city":"Nieuwegein","country":"nl","localized_country_name":"Netherlands"},"is_online_event":false,"eventType":"PHYSICAL","group":{"created":1465915067000,"name":"Codestar Night","id":20072875,"join_mode":"open","lat":52.099998474121094,"lon":5.110000133514404,"urlname":"Codestar-Night","who":"Codestars","localized_location":"Utrecht, Netherlands","state":"","country":"nl","region":"en_US","timezone":"Europe/Amsterdam"},"link":"https://www.meetup.com/codestar-night/events/293996924/","description":"

As an experienced software tester, you understand the importance of ensuring that the software you test always meets the highest quality standards. While you acknowledge the value of automated testing, you also recognise that not all tests can be automated due to their complexity or cost. Additionally, you have noticed that pre-conceived tests are not always comprehensive enough to identify unforeseen issues that arise in production.

You may wonder how it's possible to include unforeseen issues in pre-conceived tests. And that's where this workshop comes in! We will introduce you to Session Based Testing, which can help you become more creative and identify potential issues before they cause problems in production. The workshop will teach you the principles of Exploratory Testing using heuristics, mnemonics, and tours. You will also learn how to apply focus to your testing efforts.

At the end of the workshop, you will receive cheat sheets and charter ideas to help you implement Exploratory Testing within your organisation and improve the quality of your software. Together, we will explore how to use this approach to identify and address potential issues, even those that may not have been considered in advance.

Key Learnings:
\\* What is Exploratory Testing
\\* How you can use ET in your day to day practice
\\* Helpful cheatsheets and templates

Don't forget to bring your laptop as it will be a hands on workshop! We take care of food and drinks.

Agenda:
17:00 Walk-in
17:15 Start diner
17:45 Start workshop
20:00 End workshop

","visibility":"public","member_pay_fee":false,"featured_photo":{"id":513443419,"highres_link":"https://secure.meetupstatic.com/photos/event/5/b/7/b/highres_513443419.jpeg","photo_link":"https://secure.meetupstatic.com/photos/event/5/b/7/b/600_513443419.jpeg","thumb_link":"https://secure.meetupstatic.com/photos/event/5/b/7/b/thumb_513443419.jpeg","type":"event","base_url":"https://secure.meetupstatic.com"}},{"created":1681385480000,"duration":7200000,"id":"292868956","name":"Codesmiths Unite Groningen","date_in_series_pattern":false,"status":"past","time":1685030400000,"local_date":"2023-05-25","local_time":"18:00","updated":1685040899000,"utc_offset":7200000,"waitlist_count":0,"yes_rsvp_count":1,"venue":{"id":26219881,"name":"Europaweg 31","lat":53.210933685302734,"lon":6.585259914398193,"repinned":true,"address_1":"Europaweg 31","city":"Groningen","country":"nl","localized_country_name":"Netherlands"},"is_online_event":false,"eventType":"PHYSICAL","group":{"created":1465915067000,"name":"Codestar Night","id":20072875,"join_mode":"open","lat":52.099998474121094,"lon":5.110000133514404,"urlname":"Codestar-Night","who":"Codestars","localized_location":"Utrecht, Netherlands","state":"","country":"nl","region":"en_US","timezone":"Europe/Amsterdam"},"link":"https://www.meetup.com/codestar-night/events/292868956/","description":"

Ordina Codesmiths stand for a shared passion in Software Engineering and knowledge sharing.
Over the last 2 years we organized Codesmiths Unite, to share knowledge in a Drive In format. Do you remember? As there's no more restrictions due to Covid we're organizing our 2023 edition in person.
So join us on the 25th of May and meet your peer developers and hear interesting learnings on topics as Cloud, Security, Frontend, Mobile and testing.

**Program:**
**Walk in                        17:30 hrs**
**Grab some food and drnks    18:00 hrs**
**Slot 1                         18:15 - 18:45 hrs**
Lessons learned with Flutter (Rogier van Apeldoorn)
**Slot 2                         18:50 - 19:20 hrs**
Cloud Design (Twan Koot & Michiel Hamers)
**Slot 3                         19:30 - 20:00 hrs**
Get started with security (Sebastiaan Zeeff)
**Drinks                        20:00 hrs**

**About the talks and presenters**

**Rogier van Apeldoorn - Lessons learned with Flutter**

Over the past two years, Ordina has been developing the consumer app for a Dutch health insurance company, using Flutter, Google's platform-independent solution.

Rogier will share his lessons learned during the building of this app.

He discusses:

* The chosen architecture and state management patterns that are used.
* Was Flutter the right technology for building the app?
* What is the learning curve for Flutter and how to jump start?
* What does he see as the future of Flutter?

**Twan Koot / Michiel Hamers - Design for costs, four pillars of economic cloud design**

Developers are being exposed to things like FinOps or a massive Azure bill. So let's start incorporating costs into our cloud design to make the best performance solution and the most economical solution!
In 2022 we see that security by design is common sense, why not incorporate the financial aspect.
In this session we will share our thoughts on maintaining grip on your cloud bill & maintaining high performance. By incorporating our four pillars of economic cloud design you are able to design cost efficient and high performant cloud solutions.
We will of course also explain \"Zero User Costs\" and \"Geo Efficiency\" so you can start today.

**Sebastiaan Zeeff - Get Started With Security: An introduction for developers**

Most developers will agree that security is an important consideration in modern software development projects. At the same time, most developers don’t consider themselves to be security experts. While most of us are doing our best, it’s difficult to know what we’re missing or what our blindspots are. Luckily enough, you don’t have to be a security expert to follow a systematic approach to security.

In this talk, I will introduce you to the OWASP DevSecOps Maturity Model, a comprehensive framework that you can use to assess the maturity of your current approach to security. It also provides you with clear steps that you can take to improve your approach to security. My main focus will be on the dimensions in the model that are directly relevant to developers and I will give you a few examples of practices that you can start implementing today!

","visibility":"public","member_pay_fee":false,"featured_photo":{"id":512042792,"highres_link":"https://secure.meetupstatic.com/photos/event/a/e/8/highres_512042792.jpeg","photo_link":"https://secure.meetupstatic.com/photos/event/a/e/8/600_512042792.jpeg","thumb_link":"https://secure.meetupstatic.com/photos/event/a/e/8/thumb_512042792.jpeg","type":"event","base_url":"https://secure.meetupstatic.com"}},{"created":1681833264000,"duration":7200000,"id":"292976982","name":"Style your React apps without stress!","date_in_series_pattern":false,"status":"past","time":1685028600000,"local_date":"2023-05-25","local_time":"17:30","updated":1685040866000,"utc_offset":7200000,"waitlist_count":0,"yes_rsvp_count":2,"venue":{"id":24315864,"name":"Ordina HQ ","lat":52.05641174316406,"lon":5.110540866851807,"repinned":true,"address_1":"Ringwade 1","city":"Nieuwegein","country":"nl","localized_country_name":"Netherlands"},"is_online_event":false,"eventType":"PHYSICAL","group":{"created":1465915067000,"name":"Codestar Night","id":20072875,"join_mode":"open","lat":52.099998474121094,"lon":5.110000133514404,"urlname":"Codestar-Night","who":"Codestars","localized_location":"Utrecht, Netherlands","state":"","country":"nl","region":"en_US","timezone":"Europe/Amsterdam"},"link":"https://www.meetup.com/codestar-night/events/292976982/","description":"

Traditionally, dynamic styling has always been a controversial topic for many JavaScript/Frontend developers. CSS Custom properties have given us many ways to improve this, however how would it feel to have the full versatile power of a programming language within CSS? With Styled components this is now possible within the React ecosystem and in this video series I will introduce the main concepts to get started. I will cover:

1. Setting up styled components
2. Converting traditional CSS in Styled Components.
3. Set up Theming with Typescript.
4. Adding global styles
5. Extending styles and more…

If you have ever worries how to so custom SaaS styling or how to easily implement a dark mode, this meetup is for you! We will dive in the How and why we would use Styled Components. It’s an OPTIONAL code-along workshop with ample opportunities to ask for questions and best practises. Within 2 hours we will cover the goals listed above and once you leave the room, you will be able to setup and use Styled Components in your own projects. that’s a promise! Who is Rodney Wormsbecher
Rodney is a senior frontend developer who’s been involved in numerous big and small web projects within the Netherlands. Over the past 3 years he has used Styled Components extensively for frontend applications and style libraries. Requirements

* Some experience with React
* Some exposure to CSS

Connect with the author? [https://www.linkedin.com/in/rocodemy](https://www.linkedin.com/in/rocodemy)

","visibility":"public","member_pay_fee":false}]},"__N_SSG":true} \ No newline at end of file diff --git a/_next/static/TnaEdhvUAqE4h18cinFPy/_buildManifest.js b/_next/static/I8DQk3SQ1bfjxyOfpYxwa/_buildManifest.js similarity index 100% rename from _next/static/TnaEdhvUAqE4h18cinFPy/_buildManifest.js rename to _next/static/I8DQk3SQ1bfjxyOfpYxwa/_buildManifest.js diff --git a/_next/static/TnaEdhvUAqE4h18cinFPy/_ssgManifest.js b/_next/static/I8DQk3SQ1bfjxyOfpYxwa/_ssgManifest.js similarity index 100% rename from _next/static/TnaEdhvUAqE4h18cinFPy/_ssgManifest.js rename to _next/static/I8DQk3SQ1bfjxyOfpYxwa/_ssgManifest.js diff --git a/_next/static/css/25fb650e40f0d4b9.css b/_next/static/css/1dae025d113c10be.css similarity index 54% rename from _next/static/css/25fb650e40f0d4b9.css rename to _next/static/css/1dae025d113c10be.css index f4bb542..015a2db 100644 --- a/_next/static/css/25fb650e40f0d4b9.css +++ b/_next/static/css/1dae025d113c10be.css @@ -1 +1 @@ -body,html{padding:0;margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif}a{color:inherit;text-decoration:none}*{box-sizing:border-box}@media (prefers-color-scheme:dark){html{color-scheme:dark}body{--cs-bg-color:#00254b;color:#cdcdcd;background:var(--cs-bg-color)}} \ No newline at end of file +body,html{padding:0;margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif}a{color:inherit;text-decoration:none}*{box-sizing:border-box}html{color-scheme:dark}body{--cs-bg-color:#00254b;color:#cdcdcd;background:var(--cs-bg-color)} \ No newline at end of file diff --git a/events.html b/events.html index ea4cbe9..7011236 100644 --- a/events.html +++ b/events.html @@ -1 +1 @@ -

Events

Ordina Frontend Community presents: Back to basics panel discussion

<p>**Back to basics panel discusison**<br/>Ordina's Frontend Community would like to present to you an open and interactive discussion about the world of frontend. We'll talk about *"How we've gotten here and where it is going".*</p> <p>Come and join us to have a chat about how complex the world of modern front end development has become, trends we see returning from the past and how this all affects our daily jobs as frontend developers.</p> <p>Topics like:</p> <p>* **Have our tools** been focussed too much on **Developer Experience**, instead of the **User**?<br/>\- What **benefits** do our **modern stacks** have, and **for who** are these benefits?</p> <p>And more, we're **taking** your **suggestions**!</p> <p><a href="https://forms.office.com/e/dLK7MbgHm6" class="linkified">https://forms.office.com/e/dLK7MbgHm6</a></p> <p>**Programme**<br/>**17:30 Walk-in, dinner &amp; drinks**<br/>A diverse dinner will be served, any dietary preferences or restrictions can be mentioned in the signup form.</p> <p>**18:45 Introductions of our panelists**<br/>We'll move to the main venue room and open with a short introduction of our panelists and their diverse experiences.</p> <p>**19:00 Panel discussion**<br/>Kick off the panel discussion with some topics, suggested by **you**! Use the signup form to add your ideas/controversial topics or other suggestions to the discussion up front!</p> <p>**20:00 Closing &amp; Drinks**<br/>After a good hour of chatting about a diverse range of prepared topics and questions, we'll close the main room. There'll be plenty of opportunity to continue any discussions or conversations with a drink and snack before we close the venue for the day.</p> <p>This event will be cross posted on Meetup.com and internally to Ordina colleagues. Therefore there will be a stricter limit on amount of registrations for this specific event.</p>

Creating UI libraries by utilizing Storybook, ReactJs, NPM and Azure.

<p>Sign up for this event here: [<a href="https://www.meetup.com/utrecht-frontend-meetup/events/295531915/](https://www.meetup.com/utrecht-frontend-meetup/events/295531915/" class="linkified">https://www.meetup.com/utrecht-frontend-meetup/events/295531915/](https://www.meetup.com/utrecht-frontend-meetup/events/295531915/</a>)</p> <p>If you have ever attempted to extract your UI libraries into an abstract package which can be consumed just like any other NPM package. You’ll probably have encountered quite a few hurdles. For example:</p> <p>1. How do I build the code, do I use CJS or ESM?</p> <p>2. How do I ensure code quality?</p> <p>3. How do I actually publish an NPM package?</p> <p>4. Can the publishing of packages be automated by CI/CD?</p> <p>5. How do I provide interactive documentation like Bootstrap or Material UI?</p> <p>If you have ever encountered or wondered about these questions this workshop is for you. We will set up a Storybook Application, unit test it, publish it via CI/CD, containerize it with Docker, publish our container to Azure Container Registry and finally publish the container to an Azure web app.</p> <p>The workshop will be hosted on the 28*th* of September 17:00 - 21:00, food and drinks are included!</p> <p>Pre-requisites: Some experience with JavaScript. Any CI/CD experience will help but is not necessary.</p> <p>A github Repo will be available for reference.</p>

Workshop Red Hat OpenShift

<p>Free registration is open @ [<a href="https://www.ordina.com/insights/events/red-hat-openshift-workshop/](https://www.ordina.com/insights/events/red-hat-openshift-workshop/" class="linkified">https://www.ordina.com/insights/events/red-hat-openshift-workshop/](https://www.ordina.com/insights/events/red-hat-openshift-workshop/</a>)<br/>***Note that the registration process goes via the website above as we need to setup a lab environment specifically for you. Please keep in mind that with a no-show you're potentially taking someone else's spot.***<br/>Participate in our journey into the world of cloud-native application development and deployment. Embrace the efficiency of cloud-native CI/CD pipelines with Openshift and learn how to streamline your application lifecycle management with OpenShift GitOps. With two dynamic workshops on 27 September led by an experienced Red Hat instructor focusing on OpenShift Pipelines and OpenShift GitOps, you can gain hands-on skills and insights that enable you to stay ahead in the rapidly evolving landscape of cloud-native technology.<br/>**Program:**<br/>**Walk in 14:30 - 15:00 hrs**<br/>**Introduction Red Hat and OpenShift 15:00 - 16:00 hrs**<br/>**Labs 16:00 - 18:30 hrs**</p> <p>* *1- Introduction Openshift pipelines*</p> <p>OpenShift Pipelines is a cloud-native, CI/CD delivery solution to build pipelines on OpenShift using Tekton.<br/>* 2- *OpenShift GitOps*</p> <p>Start using OpenShift GitOps and start deployments with Red Hat OpenShift GitOps (based on ArgoCD) and use Kustomize, sync waves, and hooks.</p> <p>**Closure 18:30 - 19:00 hrs**<br/>Don't miss this chance to elevate your technical expertise and reserve your spot now for our upcoming Red Hat OpenShift workshop on September 27th and get up to speed in the world of modern application development and operations.<br/>***Don't forget to bring your own laptop!***</p>

AI Hackathon

<p>**AI Hackathon,** by Ordina's Frontend Guild<br/>"Attention developers and all AI enthusiasts! Are you looking for an exciting and spontaneous challenge that will put your coding skills to the test? Then join us for a ChatGPT hackathon where you'll have two hours to create a functional and practical application using ChatGPT's natural language processing capabilities. Whether you're a seasoned developer or new to AI, this is your chance to show off your skills and creativity in a fast-paced and dynamic environment. So come as you are and see what you can accomplish with ChatGPT by your side!."</p> <p>**Program:**<br/>**Walk in                        17:30 hrs**<br/>**Grab some food and drinks    18:00 hrs**<br/>Start Hackathon 18:15 hrs</p>

Ordina presents: Exploratory Testing | Navigating Through Uncharted Territory

<p>As an experienced software tester, you understand the importance of ensuring that the software you test always meets the highest quality standards. While you acknowledge the value of automated testing, you also recognise that not all tests can be automated due to their complexity or cost. Additionally, you have noticed that pre-conceived tests are not always comprehensive enough to identify unforeseen issues that arise in production.</p> <p>You may wonder how it's possible to include unforeseen issues in pre-conceived tests. And that's where this workshop comes in! We will introduce you to Session Based Testing, which can help you become more creative and identify potential issues before they cause problems in production. The workshop will teach you the principles of Exploratory Testing using heuristics, mnemonics, and tours. You will also learn how to apply focus to your testing efforts.</p> <p>At the end of the workshop, you will receive cheat sheets and charter ideas to help you implement Exploratory Testing within your organisation and improve the quality of your software. Together, we will explore how to use this approach to identify and address potential issues, even those that may not have been considered in advance.</p> <p>Key Learnings:<br/>\* What is Exploratory Testing<br/>\* How you can use ET in your day to day practice<br/>\* Helpful cheatsheets and templates</p> <p>Don't forget to bring your laptop as it will be a hands on workshop! We take care of food and drinks.</p> <p>Agenda:<br/>17:00 Walk-in<br/>17:15 Start diner<br/>17:45 Start workshop<br/>20:00 End workshop</p>

Codesmiths Unite Groningen

<p>Ordina Codesmiths stand for a shared passion in Software Engineering and knowledge sharing.<br/>Over the last 2 years we organized Codesmiths Unite, to share knowledge in a Drive In format. Do you remember? As there's no more restrictions due to Covid we're organizing our 2023 edition in person.<br/>So join us on the 25th of May and meet your peer developers and hear interesting learnings on topics as Cloud, Security, Frontend, Mobile and testing.</p> <p>**Program:**<br/>**Walk in                        17:30 hrs**<br/>**Grab some food and drnks    18:00 hrs**<br/>**Slot 1                         18:15 - 18:45 hrs**<br/>Lessons learned with Flutter (Rogier van Apeldoorn)<br/>**Slot 2                         18:50 - 19:20 hrs**<br/>Cloud Design (Twan Koot &amp; Michiel Hamers)<br/>**Slot 3                         19:30 - 20:00 hrs**<br/>Get started with security (Sebastiaan Zeeff)<br/>**Drinks                        20:00 hrs**</p> <p>**About the talks and presenters**</p> <p>**Rogier van Apeldoorn - Lessons learned with Flutter**</p> <p>Over the past two years, Ordina has been developing the consumer app for a Dutch health insurance company, using Flutter, Google's platform-independent solution.</p> <p>Rogier will share his lessons learned during the building of this app.</p> <p>He discusses:</p> <p>* The chosen architecture and state management patterns that are used.<br/>* Was Flutter the right technology for building the app?<br/>* What is the learning curve for Flutter and how to jump start?<br/>* What does he see as the future of Flutter?</p> <p>**Twan Koot / Michiel Hamers - Design for costs, four pillars of economic cloud design**</p> <p>Developers are being exposed to things like FinOps or a massive Azure bill. So let's start incorporating costs into our cloud design to make the best performance solution and the most economical solution!<br/>In 2022 we see that security by design is common sense, why not incorporate the financial aspect.<br/>In this session we will share our thoughts on maintaining grip on your cloud bill &amp; maintaining high performance. By incorporating our four pillars of economic cloud design you are able to design cost efficient and high performant cloud solutions.<br/>We will of course also explain "Zero User Costs" and "Geo Efficiency" so you can start today.</p> <p>**Sebastiaan Zeeff - Get Started With Security: An introduction for developers**</p> <p>Most developers will agree that security is an important consideration in modern software development projects. At the same time, most developers don’t consider themselves to be security experts. While most of us are doing our best, it’s difficult to know what we’re missing or what our blindspots are. Luckily enough, you don’t have to be a security expert to follow a systematic approach to security.</p> <p>In this talk, I will introduce you to the OWASP DevSecOps Maturity Model, a comprehensive framework that you can use to assess the maturity of your current approach to security. It also provides you with clear steps that you can take to improve your approach to security. My main focus will be on the dimensions in the model that are directly relevant to developers and I will give you a few examples of practices that you can start implementing today!</p>

Style your React apps without stress!

<p>Traditionally, dynamic styling has always been a controversial topic for many JavaScript/Frontend developers. CSS Custom properties have given us many ways to improve this, however how would it feel to have the full versatile power of a programming language within CSS? With Styled components this is now possible within the React ecosystem and in this video series I will introduce the main concepts to get started. I will cover:</p> <p>1. Setting up styled components<br/>2. Converting traditional CSS in Styled Components.<br/>3. Set up Theming with Typescript.<br/>4. Adding global styles<br/>5. Extending styles and more…</p> <p>If you have ever worries how to so custom SaaS styling or how to easily implement a dark mode, this meetup is for you! We will dive in the How and why we would use Styled Components. It’s an OPTIONAL code-along workshop with ample opportunities to ask for questions and best practises. Within 2 hours we will cover the goals listed above and once you leave the room, you will be able to setup and use Styled Components in your own projects. that’s a promise! Who is Rodney Wormsbecher<br/>Rodney is a senior frontend developer who’s been involved in numerous big and small web projects within the Netherlands. Over the past 3 years he has used Styled Components extensively for frontend applications and style libraries. Requirements</p> <p>* Some experience with React<br/>* Some exposure to CSS</p> <p>Connect with the author? [<a href="https://www.linkedin.com/in/rocodemy](https://www.linkedin.com/in/rocodemy" class="linkified">https://www.linkedin.com/in/rocodemy](https://www.linkedin.com/in/rocodemy</a>)</p>

\ No newline at end of file +

Events

Workshop Red Hat Ansible Lightspeed and other Ansible development tools

<p>You can sign up right now via this link: [<a href="https://www.ordina.com/insights/events/red-hat-openshift-workshop-2/](https://www.ordina.com/insights/events/red-hat-openshift-workshop-2/" class="linkified">https://www.ordina.com/insights/events/red-hat-openshift-workshop-2/](https://www.ordina.com/insights/events/red-hat-openshift-workshop-2/</a>)</p> <p>Recently Ansible Lightspeed has been introduced by Red Hat as an addition to existing developer tools in Ansible. Ansible Lightspeed (including IBM Watson Code Assistant) is a generative AI tool which makes it easier for developers to automate tasks in Ansible playbooks and create Ansible content. This session led by a Red Hat instructor is themed around "A day in the life of an (Ansible) software developer" and is focusing on tools that can help developers to create and improve Ansible playbooks in an efficient way.</p> <p>**Agenda**</p> <p>* 14:30 - 15:00: Registration<br/>* 15:00 - 16:00: A day in the life of an Ansible developer<br/>* 16:00 - 18:15: Labs<br/>* 18:15- 18:30: Closure</p> <p>**When** : November 30th 2023 van 15:00-19:00<br/>**Where** : Ringwade 1, Nieuwegein<br/>**Who** : Software developers, Cloud Engineers and DevOps Engineers<br/>**What** : Bring your own laptop.</p>

Codesmiths Unite

<p>**Details**<br/>Ordina Codesmiths stand for a shared passion in Software Engineering and knowledge sharing.<br/>Join us on the 23rd of November and meet your peer developers and hear interesting learnings on topics as Cloud, Security, Frontend, Mobile and testing.</p> <p>**Program:**<br/>**Walk in 17:00**<br/>**Buffet and drinks 17:15**<br/>**Opening 18:00**<br/>**Talk 1 18:10 - 18:35**<br/>Frederieke Scheper - Kubernetes deployment done right<br/>**Talk 2 18:40 - 19:05**<br/>Rick Hutten - Simplifying Concurrency<br/>**Break**<br/>**Talk 3 19:20 - 19:45**<br/>Kaya Weers - Design patterns<br/>**Drinks 19:45**</p> <p>**About the talks and presenters**</p> <p>**Frederieke Scheper**<br/>**Helm - Kubernetes deployments done right**<br/>Instead of steering into the murky waters of unmaintainable copy-pasted Kubernetes YAML files, let’s take the Helm and let it manage all your Kubernetes deployments, from a simple Spring Boot microservice to the most complex Kubernetes application! In this presentation, I will show you how easy it is to create, version, share, and publish Helm Charts. So, start using Helm and stop the copy-and-pasting. Along the way, you will discover the real benefits that lay in the role it plays in streamlining your CI/CD pipelines. Helm automatically maintains a database of all the versions of your releases. So, whenever something goes wrong during deployment, rolling back to the previous version is just one command away. So, let’s take a deep dive into Helm charts, templates, and functions: Kubernetes deployments done right!</p> <p>**Rick Hutten**<br/>**Simplifying Concurrency with Project Loom: A Journey with Pizza-chef Fabio**<br/>Project Loom, a groundbreaking feature within OpenJDK, introduces a lightweight and versatile concurrency model for Java. Understanding concurrency can be challenging, especially for non-technical individuals and novice developers. In this session, we embark on an adventure alongside Fabio, a passionate pizza-chef facing similar challenges in his upscale restaurant as those encountered in multithreading on a CPU. We delve into concepts such as CPU threads, virtual threads, and structured concurrency, making them accessible to listeners of all proficiency levels. Attendees will not only learn to recognize the use cases of these techniques but also gain insights into how and if Project Loom can enhance their application.</p> <p>**Kaya Weers**<br/>**A design pattern goes to the supermarket**<br/>Everybody knows the term design patterns. Some know the patterns and correct implementation by heart. Others vaguely recognize the pattern names but don’t recall the details. This talk is intended for the latter group.<br/>I’ll dive into a couple of design patterns using real-life examples. What would a design pattern look like in day-to-day life? We’ll follow Bobby and Billie and discover how a design pattern would behave in a non-digital environment: the supermarket! With the help of drawings, this talk will give you a solid understanding of design patterns, so you won't have to look them up ever again!</p>

Tech Women Connect

<p>On the 23*rd* of November we are organizing the Tech Women Connect event at the Ordina office in Utrecht(Nieuwegein), it’s an inspiring gathering that celebrates and empowers women in the tech industry.</p> <p>In the last four decades, there has been increasingly more attention on the participation of women in male-dominated sectors, such as IT — another milestone to celebrate. However, women in male-dominated careers still face challenges today.<br/>Modern day workforces are moving in the right direction, yet many women are not experiencing the benefits. So how can individual women continue and accelerate to thrive in male-dominated industries?<br/>Perhaps the best approach is to ask individual women who have done it…</p> <p>Here’s what you can look forward to:</p> <p>**Valuable Insights:** *Gain priceless insights from accomplished women in tech. Learn from their experiences, achievements, and challenges, and discover how you can succeed and thrive in the tech industry.*<br/>**Networking Opportunities:** *Connect with remarkable tech women, industry leaders, and like-minded professionals. Forge new connections, exchange ideas.*<br/>**Exciting Games and Activities!**</p> <p>**Event Details:**<br/>Date: November 23, 2023<br/>Time: 16:00 – 20:00<br/>Venue: A12.06 AUDITORIUM, Ringwade 1, Nieuwegein</p> <p>**Program Schedule:**</p> <p>* **16:00 – 16:40: Keynote Speaker (Stacy Cashmore – “My Journey into Speaking”)** *Join us as we kick off the evening with an engaging keynote address from a prominent tech women who will share her remarkable journey into the world of public speaking. Get ready to be inspired by her insights and experiences.*<br/>* **17:00 – 18:00: Panel Discussion – “Tech Women in a Male-Dominated Culture”** *Our panel of women tech experts will engage in a discussion on the challenges and triumphs of women working in male-dominated environments.*<br/>* **18:00 – 18:30: Keynote Speaker (Kaya Weers – “The Non-Typical Dev”)** *Our second keynote speaker will dive into the world of not fitting in the stereotypes and the importance of feeling like you belong.*<br/>* **19:00 onwards: Dinner and Networking** – *it’s time to relax, connect, and enjoy small drinks and some snacks (vegetarian options included).*</p> <p>**Note:** we have limited seats for external attendees. Please confirm and sign up as soon as possible to secure your seat. Once you receive a confirmation from our side you will be a confirmed guest to the event..</p> <p>**How to get there?**</p> <p>**Public transport**<br/>At Utrecht Centraal, take BUS 65/74/77 or Tram 60, both stop at Westraven, from there it’s a 5-10 min walk to the Ordina office.</p> <p>**Car**<br/>You have free parking outside the Ordina office (Ringwade 1, Nieuwegein)</p>

Ordina Frontend Community presents: Back to basics panel discussion

<p>**Back to basics panel discusison**<br/>Ordina's Frontend Community would like to present to you an open and interactive discussion about the world of frontend. We'll talk about *"How we've gotten here and where it is going".*</p> <p>Come and join us to have a chat about how complex the world of modern front end development has become, trends we see returning from the past and how this all affects our daily jobs as frontend developers.</p> <p>Topics like:</p> <p>* **Have our tools** been focussed too much on **Developer Experience**, instead of the **User**?<br/>\- What **benefits** do our **modern stacks** have, and **for who** are these benefits?</p> <p>And more, we're **taking** your **suggestions**!</p> <p><a href="https://forms.office.com/e/dLK7MbgHm6" class="linkified">https://forms.office.com/e/dLK7MbgHm6</a></p> <p>**Programme**<br/>**17:30 Walk-in, dinner &amp; drinks**<br/>A diverse dinner will be served, any dietary preferences or restrictions can be mentioned in the signup form.</p> <p>**18:45 Introductions of our panelists**<br/>We'll move to the main venue room and open with a short introduction of our panelists and their diverse experiences.</p> <p>**19:00 Panel discussion**<br/>Kick off the panel discussion with some topics, suggested by **you**! Use the signup form to add your ideas/controversial topics or other suggestions to the discussion up front!</p> <p>**20:00 Closing &amp; Drinks**<br/>After a good hour of chatting about a diverse range of prepared topics and questions, we'll close the main room. There'll be plenty of opportunity to continue any discussions or conversations with a drink and snack before we close the venue for the day.</p> <p>This event will be cross posted on Meetup.com and internally to Ordina colleagues. Therefore there will be a stricter limit on amount of registrations for this specific event.</p>

Creating UI libraries by utilizing Storybook, ReactJs, NPM and Azure.

<p>Sign up for this event here: [<a href="https://www.meetup.com/utrecht-frontend-meetup/events/295531915/](https://www.meetup.com/utrecht-frontend-meetup/events/295531915/" class="linkified">https://www.meetup.com/utrecht-frontend-meetup/events/295531915/](https://www.meetup.com/utrecht-frontend-meetup/events/295531915/</a>)</p> <p>If you have ever attempted to extract your UI libraries into an abstract package which can be consumed just like any other NPM package. You’ll probably have encountered quite a few hurdles. For example:</p> <p>1. How do I build the code, do I use CJS or ESM?</p> <p>2. How do I ensure code quality?</p> <p>3. How do I actually publish an NPM package?</p> <p>4. Can the publishing of packages be automated by CI/CD?</p> <p>5. How do I provide interactive documentation like Bootstrap or Material UI?</p> <p>If you have ever encountered or wondered about these questions this workshop is for you. We will set up a Storybook Application, unit test it, publish it via CI/CD, containerize it with Docker, publish our container to Azure Container Registry and finally publish the container to an Azure web app.</p> <p>The workshop will be hosted on the 28*th* of September 17:00 - 21:00, food and drinks are included!</p> <p>Pre-requisites: Some experience with JavaScript. Any CI/CD experience will help but is not necessary.</p> <p>A github Repo will be available for reference.</p>

Workshop Red Hat OpenShift

<p>Free registration is open @ [<a href="https://www.ordina.com/insights/events/red-hat-openshift-workshop/](https://www.ordina.com/insights/events/red-hat-openshift-workshop/" class="linkified">https://www.ordina.com/insights/events/red-hat-openshift-workshop/](https://www.ordina.com/insights/events/red-hat-openshift-workshop/</a>)<br/>***Note that the registration process goes via the website above as we need to setup a lab environment specifically for you. Please keep in mind that with a no-show you're potentially taking someone else's spot.***<br/>Participate in our journey into the world of cloud-native application development and deployment. Embrace the efficiency of cloud-native CI/CD pipelines with Openshift and learn how to streamline your application lifecycle management with OpenShift GitOps. With two dynamic workshops on 27 September led by an experienced Red Hat instructor focusing on OpenShift Pipelines and OpenShift GitOps, you can gain hands-on skills and insights that enable you to stay ahead in the rapidly evolving landscape of cloud-native technology.<br/>**Program:**<br/>**Walk in 14:30 - 15:00 hrs**<br/>**Introduction Red Hat and OpenShift 15:00 - 16:00 hrs**<br/>**Labs 16:00 - 18:30 hrs**</p> <p>* *1- Introduction Openshift pipelines*</p> <p>OpenShift Pipelines is a cloud-native, CI/CD delivery solution to build pipelines on OpenShift using Tekton.<br/>* 2- *OpenShift GitOps*</p> <p>Start using OpenShift GitOps and start deployments with Red Hat OpenShift GitOps (based on ArgoCD) and use Kustomize, sync waves, and hooks.</p> <p>**Closure 18:30 - 19:00 hrs**<br/>Don't miss this chance to elevate your technical expertise and reserve your spot now for our upcoming Red Hat OpenShift workshop on September 27th and get up to speed in the world of modern application development and operations.<br/>***Don't forget to bring your own laptop!***</p>

AI Hackathon

<p>**AI Hackathon,** by Ordina's Frontend Guild<br/>"Attention developers and all AI enthusiasts! Are you looking for an exciting and spontaneous challenge that will put your coding skills to the test? Then join us for a ChatGPT hackathon where you'll have two hours to create a functional and practical application using ChatGPT's natural language processing capabilities. Whether you're a seasoned developer or new to AI, this is your chance to show off your skills and creativity in a fast-paced and dynamic environment. So come as you are and see what you can accomplish with ChatGPT by your side!."</p> <p>**Program:**<br/>**Walk in                        17:30 hrs**<br/>**Grab some food and drinks    18:00 hrs**<br/>Start Hackathon 18:15 hrs</p>

\ No newline at end of file diff --git a/index.html b/index.html index 13e3a0a..03379b5 100644 --- a/index.html +++ b/index.html @@ -1,4 +1,4 @@ -Codestar
Codestar makes highly available, scalable solutions with functional reactive programming in the back-end and frontend. Our colleagues are published in magazines and on blogs. Also see the Codestar YouTube channel for our talks at conferences.

mdworld

Fri, 08 Apr 2022

Micro Frontends in A Nutshell

Nathan Perdijk

Fri, 06 Nov 2020

Tika NERding: Getting started using Named-Entity Recognition with OpenNLP on the JVM (Scala, Java…

Nathan Perdijk

Fri, 10 Apr 2020

Tika Tika! Getting started doing OCR with Apache Tika andTesseract from the JVM

Bjorn ‘Bjeaurn’

Fri, 14 Feb 2020

Upgrading to Angular 9: My experience

W

Werner de Groot

Tue, 25 Jun 2019

Leibniz equality in TypeScript

Nick ten Veen

Fri, 07 Jun 2019

Event sourcing with Akka Persistence

Bjorn ‘Bjeaurn’

Tue, 21 May 2019

How we automated our Angular updates

mdworld

Thu, 02 May 2019

Apollo Client in Practice

Nathan Perdijk

Wed, 01 May 2019

Sharing is Caring! Domain objects in BOTH Scala and R with GraalVM Polyglot bindings.

Hamza Haiken

Fri, 12 Apr 2019

Using generative art to create a pulsating SVG star

\ No newline at end of file