Créez des composants. Obtenez une infrastructure et un éditeur visuel.
Définissez les contrats de composants. Les équipes de contenu disposent d'outils d'édition professionnels. L'infrastructure est automatisée. Vous gérez les composants, pas les systèmes.
Gratuit pour les sites de brouillon. Déployez-le où vous voulez.
Vos schémas définissent le contrat
Lorsque vous créez des composants orientés utilisateur, vous définissez leur schéma : les paramètres qu'ils acceptent, leurs options de valeur et leurs descriptions. Ce schéma est un contrat qui indique ce qu'un éditeur de contenu peut réaliser avec le composant.
À partir de cette seule définition :
L'infrastructure fournit des services.
Les formulaires sont envoyés à une base de données. Les fichiers sont téléchargés vers un espace de stockage. Les analyses suivent les événements. Le moteur lit vos schémas et sait quoi fournir.
La collaboration devient possible.
Vos schémas permettent des options de gestion de contenu. Utilisez l'application Uniweb pour une édition visuelle professionnelle ou gérez votre contenu via Git avec des fichiers Markdown. À vous de choisir.
Un seul contrat. Plusieurs options. Aucune duplication.
// Your React Component's Schema
export const schema = {
headline: {
type: 'string',
label: 'Headline Text',
},
ctaButton: {
type: 'object',
label: 'Call to Action',
},
};Construit comme n'importe quel projet React
Le framework structure un projet React standard. Écrivez des composants, stylisez-les et composez-les. C'est le même workflow que celui de Vite ou Next.js.
Projet React standard
Vous écrivez un composant et définissez ses accessoires dans le code.
const Hero = ({ headline, ctaText }) => {
// ... component JSX
};Ce que vous obtenez :
- Un composant de présentation
Projet Uniweb
Vous écrivez le même composant, plus un schéma pour le rendre configurable.
export const schema = { ... };
const Hero = ({ content, params }) => {
// ... component JSX
};Ce que vous obtenez :
- Un composant de présentation
- Une interface utilisateur d'édition de contenu native
- Infrastructure automatique
Le compromis réside dans une définition légèrement plus amont des composants auxquels les équipes de contenu sont confrontées. Cependant, cette documentation libère automatiquement de puissantes fonctionnalités.
Effort optionnel pour plus de capacités.
Pourquoi les schémas sont importants
Pour les développeurs
Tout site React nécessite un jour des formulaires, des téléchargements de fichiers, des analyses, une prise en charge multilingue et un hébergement. Cela représente des semaines de travail d'infrastructure indifférencié.
Pour les équipes
Le contenu doit être géré. Que ce soit via des workflows Git ou des outils visuels, il est nécessaire de mettre à jour le texte, d'échanger des images et de publier les modifications.
Vous gérez les composants, pas les systèmes.
Three Parts, Clear Ownership
Fondation - Votre projet React
Un dépôt Git dont vous êtes propriétaire. React et TypeScript standard. Utilisez n'importe quel package ou style NPM. Déployez où vous voulez.
Durée de fonctionnement du moteur - Élimine les éléments standard
Une bibliothèque JS open source pour sites publiés. Charge les composants, récupère les données, localise le contenu, suit les événements et bien plus encore automatiquement.
Application et hébergement - Infrastructure optionnelle
Un outil visuel professionnel pour les équipes de contenu. Lit les schémas pour générer des interfaces d'édition. Héberge des sites web. Vous pouvez également l'ignorer et gérer votre contenu via Git.
Les fondations expliquées
Une Fondation est un ensemble de composants de niveau section conçus pour fonctionner ensemble. Il s'agit de blocs complets et fonctionnels avec des fonctions de communication spécifiques : Héros, Fonctionnalités, Témoignages, Galerie.
Site unique ou plusieurs :
Créez une fondation unique pour un site. Gérez l'infrastructure et séparez clairement les tâches. Ou créez une fondation unique pour plusieurs sites, où les mises à jour se propagent instantanément.
Exemple:
Une fondation médicale dessert vingt cliniques. Chacune gère son propre contenu. Lorsque le développeur améliore un composant, les vingt sites en bénéficient.
Fondation ludique
Doux et convivial pour les sites de garde d'enfants ou axés sur la famille.
Comment le développement et le contenu se séparent
Le développeur construit les fondations
Créez un projet React, écrivez des composants et définissez des schémas dans votre flux de travail Git normal.
Le moteur le charge dynamiquement
Le moteur charge votre fondation au moment de l'exécution sur des sites publiés via Module Federation.
Le contenu est géré
Utilisez Git avec des fichiers Markdown ou l'application visuelle Uniweb. Your Foundation prend en charge les deux.
Les développeurs gèrent les composants. Les équipes de contenu gèrent le contenu. Aucun ne bloque l'autre.
Ce qui s'exécute automatiquement
Le moteur lit vos schémas et fournit ces services sans aucun code backend requis.
Soumissions de formulaires
Permettez aux visiteurs du site de soumettre des formulaires et des fichiers. Stockez-les dans une infrastructure back-end optionnelle grâce au moteur.
Gestion des fichiers
Téléchargez des images et des documents avec livraison CDN et optimisation automatique.
Analyse de la confidentialité
Suivi des événements sans cookie et conforme au RGPD pour l'analyse du comportement des utilisateurs.
Localisation
Outils de traduction avancés pour les rédacteurs de contenu. Le moteur localise le contenu de vos composants.
Données dynamiques
Laissez le moteur récupérer les résultats à partir du backend facultatif ou des API externes, mettre en cache les résultats et les actualiser lorsque cela est nécessaire.
Hébergement
Hébergement géré en option ou exportation de fichiers statiques à déployer n'importe où.
Comment le contenu est géré
Les fondations fonctionnent avec différents flux de travail de contenu. Vos schémas ouvrent des possibilités : la gestion du contenu dépend de votre équipe.
Git + Markdown
L'approche traditionnelle du développeur. Le contenu est hébergé dans des fichiers Markdown, aux côtés des composants. Contrôle des versions, déploiement simple et convivial pour les développeurs.
Application Uniweb
Un éditeur visuel professionnel pour les équipes de contenu. Sélecteur de composants, gestion des ressources et workflows de publication. Git non requis.
Une architecture flexible qui s'adapte à vos besoins
Le Framework prend en charge deux chemins :
Construire pour soi
Utilisez-le comme n'importe quelle configuration React. Oubliez les schémas. Bénéficiez d'une structure de composants propre et d'une infrastructure gérée automatiquement. Même effort que Vite ou Next.js.
Construire pour la collaboration
Lorsque les équipes de contenu ont besoin d'autonomie, définissez des schémas pour vos composants. Cela permet des flux de travail professionnels et des outils d'édition visuelle.
Les deux chemins fonctionnent avec la même fondation. Le contenu peut être hébergé dans Git avec des fichiers Markdown, ou dans l'application Uniweb avec des outils visuels. À vous de choisir.
L'architecture:
- Fédération de modules : les fondations se chargent dynamiquement à l'exécution. Les mises à jour se propagent sans reconstruction des sites. Le framework configure cela automatiquement.
- Limites des composants : vous définissez des composants flexibles au niveau des sections (Héros, Fonctionnalités, Contact) que les équipes de contenu peuvent utiliser de manière autonome. Idéal pour la collaboration.
- Noyau open source : le framework et le moteur sont sous licence GPL-v3. L'application est un outil hébergé optionnel pour les équipes de contenu.
Idéal pour:
Sites axés sur le contenu où la collaboration interfonctionnelle est importante. Systèmes de conception desservant plusieurs sites. Équipes où les développeurs et les créateurs de contenu ont besoin d'indépendance.
Pas idéal pour:
Les propriétaires de sites qui créent des mises en page à partir de zéro, ou les équipes de contenu qui souhaitent créer des pages à partir de blocs élémentaires tels que des cartes et des boutons. Il n'est pas non plus conçu pour créer des applications web.
Construit sur une technologie solide
Fédération de modules
Les fondations se chargent à l'exécution, et non à la compilation. Les mises à jour se propagent sans reconstruire les sites consommateurs.
Expérience du développeur
React standard avec TypeScript. Utilisez l'approche CSS et les packages NPM de votre choix.
Performances de production
Les fondations sont mises en cache à la périphérie du CDN avec division automatique du code et chargement paresseux.
Tarification transparente
Cadre
Libre et Open Source
Créez des fondations illimitées. Maîtrisez votre code.
Moteur
Libre et Open Source
S'exécute sur vos sites et gère la récupération et le traitement dynamiques des données.
Commencer à construire
Si vous êtes un développeur :
Créez une fondation avec l’outil d’échafaudage.
$ npm create @uniwebcms/framework my-foundation