docs(portfolio): 📝 add 2400 Outlier Micro Frontend

src/app/project/content/2100-outlier-conf-app.mdx

@@ -4,7 +4,6 @@ title: Outlier Conf App
 date: 2022-12-01
 description:
   App for the full lineup of speakers for the Outlier Conf, Feb 4-5th 2022
-isFeatured: true
 category:
   - DESIGN
   - DEVELOP

src/app/project/content/2400-outlier-micro-frontend.mdx

@@ -0,0 +1,65 @@
+---
+id: 2400
+title: Outlier Micro Frontend
+date: 2024-06-12
+description:
+  Web application for the localized schedule for the Outlier Conference.
+  Full-stack NextJS application with a Postgres database. The application uses a
+  micro-frontend architecture to allow for independent development and
+  deployment of each section of the application.
+isFeatured: true
+category:
+  - DEVELOP
+  - DESIGN
+image: /images/projects/2400/thumb_outlier-micro-frontend.png
+href: https://www.outlierconf.com/outlier-2024/home#agenda
+repo: https://github.com/lloydrichards/proj_outlier-microfrontend
+---
+
+For the Outlier Conference, I developed a web application to display the
+localized schedule for the event. In the past with the
+[Outlier Conf App](/project/2100-outlier-conf-app) we had a native mobile
+application, but this year we wanted to try something different. The application
+is a full-stack NextJS application with a Postgres database, and is embedded
+directly into the Outlier Conference website using an iFrame.
+
+<iframe
+  src="https://outlier-microfrontend.vercel.app/embed"
+  className="h-200 w-full p-2"
+></iframe>
+
+## Project Overview
+
+The Outlier Conference app is a way for attendees to view the schedule for the
+conference in their local timezone. With attendees from all over the world, it
+was important to have a way for them to see the schedule in their local time,
+and in the past we had issues with attendees missing sessions because they were
+in a different timezone.
+
+Another important feature of the application is the Unconf sessions. These are
+sessions that are submitted by the attendees and are not part of the official
+schedule. Creating a way for attendees to submit and view these sessions was
+important for the conference, and required the data to be updated in real-time.
+
+## Challenges and Insights
+
+Working from the designs build for the first version of the Outlier Conference
+App it was fairly easy to build the application. Creating specific pages for the
+embedded layout allowed for the application to have separate dashboards for
+adding and monitoring the schedule.
+
+With the authentication system in place, the application was able to be manage
+the Unconf sessions submitted by the attendees. The unconf dashboard could then
+be used to approve or reject the sessions, making them visible on the schedule.
+
+![](/images/projects/2400/outlier-micro-frontend-06.png)
+
+## Key Learnings
+
+Rebuilding the Outlier Conference App as a web application provided valuable
+insights:
+
+- The importance of having a localized schedule for a global event
+- The benefits of using a micro-frontend architecture to allow for independent
+  development and deployment of each section of the application
+- The importance of real-time data updates for user-generated content

src/app/project/content/2400-competitiveness-outlook-data-hub.mdx → src/app/project/content/2401-competitiveness-outlook-data-hub.mdx

@@ -1,7 +1,7 @@
 ---
-id: 2400
+id: 2401
 title: Competitiveness Outlook Data Hub
-date: 2024-06-01
+date: 2024-07-01
 description:
   Data platform for centralising and visualising the key findings of the
   Competitiveness Outlook (CO) flagship publication series. The data hub
@@ -10,13 +10,13 @@ description:
 isFeatured: true
 category:
   - DEVELOP
-image: /images/projects/2400/thumb_competitiveness-outlook-data-hub.png
+image: /images/projects/2401/thumb_competitiveness-outlook-data-hub.png
 href: https://westernbalkans-competitiveness.oecd.org/
 ---
 
 The OECD South East Europe Regional Programme (SEERP) helps communicate the
 recent successes and challenges for policymakers in each region. The SEERP's
-work is important for boosting competitiveness and regional integration in the
+work is important for boosting competitiveness and regional integration in the
 Western Balkans, in line with the region's EU agenda.
 
 ## Project Overview
@@ -41,7 +41,7 @@ standards.
 
 ## Challenges and Insights
 
-![](/images/projects/2400/competitiveness-outlook-data-hub-01.png)
+![](/images/projects/2401/competitiveness-outlook-data-hub-01.png)
 
 ### Data Visualization Complexity
 
@@ -77,7 +77,7 @@ Paris.
   the need for clear communication, compromise, and agility to achieve ambitious
   goals.
 
-![](/images/projects/2400/competitiveness-outlook-data-hub-02.png)
+![](/images/projects/2401/competitiveness-outlook-data-hub-02.png)
 
 ## Impact
 

src/app/project/content/2401-cancer-monitoring-dashboard.mdx → src/app/project/content/2402-cancer-monitoring-dashboard.mdx

@@ -1,5 +1,5 @@
 ---
-id: 2401
+id: 2402
 title: Cancer Monitoring Dashboard
 date: 2024-10-01
 description:
@@ -10,7 +10,7 @@ description:
 isFeatured: true
 category:
   - DEVELOP
-image: /images/projects/2401/thumb_cancer-monitoring-dashboard.png
+image: /images/projects/2402/thumb_cancer-monitoring-dashboard.png
 href: https://krebs-monitoring.bfs.admin.ch/de/
 ---
 
@@ -38,7 +38,7 @@ now a shared component library across multiple projects. This effort to
 standardise the UI components helps us work quickly and effectively to bring the
 design to life.
 
-![](/images/projects/2401/cancer-monitoring-dashboard-01.png)
+![](/images/projects/2402/cancer-monitoring-dashboard-01.png)
 
 ## Challenges and Insights
 

src/app/project/content/2402-ipen-plastic-map.mdx → src/app/project/content/2403-ipen-plastic-map.mdx

@@ -1,5 +1,5 @@
 ---
-id: 2402
+id: 2403
 title: IPEN Plastic Map
 date: 2024-11-01
 description:
@@ -10,7 +10,7 @@ description:
 isFeatured: true
 category:
   - DEVELOP
-image: /images/projects/2402/thumb_ipen-plastic-map.png
+image: /images/projects/2403/thumb_ipen-plastic-map.png
 href: https://ipen-plastic-map.vercel.app/
 ---
 
@@ -34,7 +34,7 @@ consumes the data and renders it on the map. The user interacts with the map by
 panning, zooming, and selecting a data point to view more information about the
 pollution data.
 
-![](/images/projects/2402/ipen-plastic-map-01.png)
+![](/images/projects/2403/ipen-plastic-map-01.png)
 
 ## Challenges and Insights
 
@@ -49,7 +49,7 @@ representing a report from IPEN. To make it easier for users to navigate the
 reports, I normalized common attributes like countries, partners, and types and
 grouped them into dropdown menus that the user could use to filter the data.
 
-![](/images/projects/2402/ipen-plastic-map-02.png)
+![](/images/projects/2403/ipen-plastic-map-02.png)
 
 ## Key Learnings