Naar hoofdinhoud gaan

Web Apps

ChurchApps omvat drie webapplicaties, elk serveerend een ander publiek en doel. Ze delen een gemeenschappelijke technische basis van React 19, TypeScript en Material-UI 7, maar verschillen in hun build-tooling en implementatiedoelen.

Applicaties in een Oogopslag

AppPurposeFrameworkDev Port
B1AdminKerkbeheerbereidingsdashboardReact 19 + Vite + MUI 75173
B1AppPubliek beschikbare kerkledappNext.js 16 + React 19 + MUI 73301
LessonsAppLessinhoudsbeheerNext.js 16 + React 193501

Gedeelde Tech Stack

Alle drie webapps zijn gebouwd met:

  • TypeScript -- End-to-end typeveiligheid
  • React 19 -- UI-onderdelenbibliotheek
  • Material-UI 7 -- Designsysteem en onderdelentoolkit
  • React Query 5 -- Serverstaat-management

Gedeelde Onderdelen

De apps delen UI-onderdelen en utilities via de @churchapps/apphelper*-familie van pakketten:

PackagePurpose
@churchapps/apphelperKerngedeelde React-onderdelen
@churchapps/apphelper-loginVerificatie-UI-onderdelen
@churchapps/apphelper-donationsDonatie- en donatie-formulieren
@churchapps/apphelper-formsFormuliermaker-onderdelen
@churchapps/apphelper-markdownMarkdown-rendering
@churchapps/apphelper-websiteWebsite/CMS-onderdelen
tip

Zie voor details over het lokaal ontwikkelen van deze gedeelde pakketten de AppHelper-documentatie.

Postinstall-script

Elke web-app heeft een postinstall-script dat locale-bestanden en CSS-assets van @churchapps/apphelper in het project kopieert. Dit draait automatisch na npm install.

info

Als onderdelen na het installeren van afhankelijkheden unstyled zijn, is het postinstall-script mogelijk niet correct uitgevoerd. U kunt het handmatig activeren met npm run postinstall.

Build-tooling

De apps gebruiken twee verschillende build-tools:

  • B1Admin gebruikt Vite -- een snelle, moderne bundler ideaal voor single-page applications
  • B1App en LessonsApp gebruiken Next.js -- serverzijdig rendering, op bestand gebaseerde routing en geoptimaliseerde productiebuild