Ceci est le guide ultime de Softr.
Dans ce guide, vous apprendrez tout ce qu'il faut savoir à propos de cet outil no code de création d'applications web, incluant :
- Fonctionnalités importantes
- Comment débuter facilement
- Conseils avancés
- Démonstration de vraies applications
- Comparaison avec d'autres outils no code
- Optimiser le SEO
- Plus encore
Tout ce que vous apprendrez dans ce guide vous donnera une bonne base pour créer une web app.
Les exemples de ce guide se baseront sur plusieurs cas de web apps, soient un portail client, un tableau de bord, un outil interne pour les entreprises et un répertoire de ressources.
Commencez par créer un compte Softr avec l'essai gratuit de 30 jours.
En résumé
Les points positifs de Softr ✅
- Simple et facile à utiliser, mais puissant
- Applications illimitées avec sous-domaine Softr + domaine personnalisé gratuit
- Intégration super efficace avec Airtable
- Templates gratuits pour démarrer sans page blanche
- Documentation complète et vidéos explicatifs
- Optimisation SEO pour chaque ligne (record)
- Beaucoup de méthode de paiements
Les points négatifs de Softr ❌
- Forum peu actif (rejoignez la communauté Slack plus active de 1k+ membres)
- Design limité (requiert du code pour être plus flexible)
Qui utilise Softr ?
Softr est principalement utilisé pour :
- Les petites et grosses entreprises
- L'équipe marketing
- Le support client
- Créer un produit en ligne avec un membership
- Tester une idée d'affaires (MVP)
Formation Airtable
En 1 à 2 journées, maîtrisez l'Excel du futur, et apprenez à gérer des données sans être informaticien·ne !
Rejoindre la formationC'est quoi Softr ?
Softr est un outil no code de création d'application web.
Ces web apps sont des portail clients, des outils internes pour les entreprises, des marketplaces, du contenu réservé aux membres, des répertoires de ressources ou même des sites web.
L'important c'est que vous avez des données sur Airtable et que vous voulez les afficher d'une quelconque façon.
Fondé en 2020, Softr est soutenu par des fonds de capital-risque. Avec la dernière levé de fonds de $13.5M, l'équipe travailleur sur :
- une boutique de composantes
- à ajouter d'autres bases de données que Airtable
- à rendre l'interface de design plus flexible
Softr est l'outil de web app la plus facile à utiliser, sincèrement. J'ai essayé Bubble, WeWeb, Bildr, Webflow, Stacker et Softr est le plus facile à maitriser.
Le studio est minimaliste et clair. Tout est intuitif.

Vous pouvez facilement prévisualiser votre app sur ordinateur, tablet et mobile en cliquant sur Preview
.

Commencer avec Softr
Pour créer une application mobile avec Softr, voici un bref aperçu des étapes clés.
Étape 1: Créer un compte
Si ce n'est pas déjà fait, créez un compte Softr avec l'essai gratuit de 30 jours. En fait, vous pouvez créer des applications gratuites avec 200 lignes sur Airtable.
Vous verrez ce tableau de bord minimaliste.

Étape 2: Créer votre application
Cliquez sur New Application
, puis comme tous les outils no code, vous aurez le choix entre une page blanche (blank) ou une page déjà construite (template).

Étape 3 : Lier votre base Airtable
Pour les blocks List
, List Details
, Table
, Calendar
, Kanban
, Chart
, Map
, etc. vous devez lier votre base Airtable.
Si vous avez choisi un template, vous devrez copier la base Airtable. Voici comment faire.

Étape 4 : Ajouter des blocks
Le studio est là où la magie opère.
À droite, vous ajouter les blocks de votre choix. La section static
sont ceux sans Aitable et la section dynamic
sont ceux avec Airtable ou d'autres données dynamic en fonction de l'utilisateur.


À gauche, vous pouvez:
- ajouter des pages ainsi que modifier les paramètres (SEO, social, etc.) de chacune
- modifier le thème de l'application, soit la couleur, la police et la largeur des pages
- configurer la section membres pour des sections payantes
- modifier les paramètres générales de l'application (intégrations, SEO, domaine, etc.)




Étape 5 : Publier 🎉
Une fois tous les blocks ajoutés, il est temps de publier en cliquant sur Publish
. Vous avez le choix entre votre domaine ou celui de Softr.

Tarification de Softr
Podia a une tarification qui s'ajuste aux types d'applications web.
Le plan Starter
est pour un site web ou les répertoires sans membership. Le plan Professional
permet de créer des apps avec des membres et vendre des produits. Le plan Business
s'adresse principalement aux entreprises et leurs outils à l'interne.
Tous les plans permettent de faire un nombre illimité d'applications.
Pour les différences, voici un aperçu.
👇 | Starter | Professional | Business |
---|---|---|---|
Prix annuel ($/mo) | $24 | $65 | $165 |
Prix mensuel ($/mo) | $29 | $79 | $199 |
Applications | Illimité | Illimité | Illimité |
Domaine personnalisé | 1 | 2 | 3 |
Collaborateur | 0 | 1 | 4 |
Lignes Airtable | 1000 | 10 000 | Illimité |
Membres | 5 | 10000 | 100 000 |
Paywall | ✅ | ✅ | ✅ |
Code | ✅ | ✅ | ✅ |
Support live chat | ✅ | ✅ | ✅ |
Transfert d'app | ❌ | ✅ | ✅ |
Softr vs les autres
Softr est une alternative à quelques outils de création de web apps comme Bubble, WeWeb, Bildr, Stacker et Glide Pages. Ils peuvent toutes faire une web app à partir d'une base Airtable.
Softr est aussi une alternative à Webflow pour la création d'un site web.
Je choisi de parler spécifiquement de Glide, car c'est un autre outil très simple à utiliser pour créer un répertoire et ajouter des membres (membership).
Aujourd'hui, je préfère Softr.
Vous pouvez lire les raisons dans ma comparaison Softr vs Glide Pages.
Les essentiels
Ce qu'il faut savoir
Toutes les applications Softr sont uniques, mais il y a une base qu'il faut connaitre pour bien faire n'importe quelle app.
La terminologie de Softr
Comme tout autre outil, il y a des termes spécifiques où il faut passer plus de temps pour bien comprendre.
Block : Une app Softr se monte comme un bloc Lego. Un block est un élément contenant de l'informations.
Database : Softr permet de montrer des données aux utilisateurs et même d'en collecter. La base de données est intégré directement avec Airtable.
Users : Ce sont les utilisateurs qui se connectent avec un compte et qui ont accès à des données non public.
Users Groups : Vous pouvez donner accès à un type d'utilisateur en fonction du type de donnée.
Edit Permissions : Les utilisateurs peuvent modifier les données Airtable. Les permissions permettent de déterminer qui à le droit de modifier quoi.
Visibility : La visibilité est le paramètre qui permet aux utilisateurs de l'application de voir des données.
Intégration avec Airtable
Plus haut, on a vu comment intégrer Airtable avec votre clé API.
Dans tous les blocks dynamic avec une base de données Airtable, il y a toujours :
- Airtable Base
- Airtable Table
- Airtable View

La base Airtable se retrouve dans le tableau de bord Airtable.

La table Airtable sont comme les onglets dans Google Chrome.

La vue Airtable permet de montrer la même base de donnée sous différentes façons, par exemple avec des filtres.

Vous pouvez modifier les données Airtable directement dans Softr. J'en parle plus bas dans la section Membership.
Autres intégrations
Softr a une intégration avec beaucoup d'outils.
Analytics : Facebook Pixel, Fathom Analytics, Google Analytics, Google Tag Manager et Hotjar
Automatisation : Make et Zapier
Cookies : Lubenda
Email marketing : Mailchimp et MailerLite
Map : Google Maps
Membership : Google Sign In et Google reCaptcha
Paiement : Gumroad, PayPal, Buy Me A Coffee et Stripe Checkout
Support : Crisp, Drift Chat, HubSpot Chat, Intercom et Typeform
Traduction en français
Une autre intégration que je n'ai pas nommé est avec Weglot afin de traduire votre site en français (ou autres langues).
J'aime Weglot et j'ai utilisé l'outil pour un de mes projets. Veuillez lire mon avis sur Weglot pour plus de détails.
Pour la traduction avec Softr, regardez ce tutoriel.
SEO
Le référencement organique est important pour une web app.
Ce l'est moins pour les outils internes pour les entreprises, mais pour le reste, si vous voulez attirez des utilisateurs externes, assurez-vous d'optimiser le SEO.
Dans Softr, il est possible de modifier le SEO dans les pages et les données Airtable.
Pages
Pour les pages, vous pouvez modifier le titre et la description qui se retrouveront visible sur les moteurs de recherche.
Allez dans les paramètres en cliquant sur les trois points, puis Settings
.


Données Airtable
Pour les données Airtable, plus spécifiquement le block List Details, vous pouvez changer 4 paramètres : index
, slug
, title
et description
.
Index : si la page doit être sur les moteurs de recherche ou non.
Slug : l'URL désiré.
Title & Description : c'est comme les pages plus haut.
Par exemple, pour un répertoire de ressources, ça permet d'avoir beaucoup plus de traffic organique.

Basé sur Ahrefs, je sais que le mot-clé "download youtube thumbnail" est recherché 1500 fois par mois.

Ces paramètres SEO me donnent la possibilité de ranker sur ce mot-clé là et tous les autres mots-clés de ma liste.
Idéalement, plus le mot-clé est difficile (car beaucoup de compétitions) comme c'est le cas ici, plus il faut aller chercher des backlinks et ajouter du contenu texte sur la page.
Pour mon répertoire, il faudrait alors que je créé une page List Details
dans Softr avec une description du free tool et autres textes pour maximiser mes chances.
Studio
Studio
Pages
Il se peut fort bien que vous deviez ajouter des pages à votre web app, sauf si c'est un tableau de bord comme celui-ci avec une seule page.
Par exemple, la web app de suivi de l'inventaire, un outil interne pour les entreprises, a 9 pages seulement. Mais, il permet beaucoup de choses !
On peut s'y connecter en tant qu'admin ou employé, de voir les commandes, les manufacturiers, l'inventaire et plus encore.
General

Ce sont les mêmes paramètres que lors de la création d'une page. Vous avez aussi les options de cacher et supprimer la page.
SEO

Nous l'avons plus haut, vous ajoutez là le titre et la description de la page qui sera visible sur les moteurs de recherche.
Social

Vous pouvez ajouter ici le même texte que le SEO et vous ajoutez une image pour les liens partagés sur les réseaux sociaux.
Default Header & Footer

Si vous voulez le même header (menu) et footer que la page d'accueil, laissez les options à ON. Si vous voulez un header ou footer personnalisé pour la page, veuillez mettre l'option à OFF.
Visibility

Nous allons le voir plus bas, mais lorsque vous avez des membres, c'est là où vous devrez dire si la page est visible pour tout le monde ou les membres.
Custom Code
Nonnnnnn, du code ! 😱

Sans blague, c'est là où vous devrez sans doute ajouter du code pour des intégrations qui ne sont pas dans la section Settings
> Integrations
.
Thèmes

Ici vous pouvez établir des valeurs par défaut pour le design de votre web app.
Typography : Vous déterminez la police d'écriture, la grosseur et la couleur pour les titres et le texte.
Buttons : Vous déterminez la couleur et la grosseur des appels à l'action.
Advanced : Vous déterminez la largeur du site web. Si vous voulez diminuer seulement la largeur du texte, vous pouvez ajouter ce bout de code dans la section Custom Code
vu plus haut.
<script>
document.addEventListener("DOMContentLoaded", function() {
$('section[class^=text] div.col-12').addClass('offset-lg-1 col-lg-10');
});
</script>
Utilisateurs
Ce que j'aime de Stripe comme méthode de paiement, c'est qu'il est possible d'accepter les paiements en mode test.
Cela permet de tester un funnel de vente par exemple.
Softr a eu la même idée en ajoutant une version test aux utilisateurs.
Cela permet de tester votre web app avec des "faux" utilisateurs où ils s'inscriront en mode "preview" de l'app.

Vous pouvez ajouter, supprimer, importer et exporter des utilisateurs.
Pour que les utilisateurs se connectent, vous pouvez donner un mot de passe généré par Softr ou un magic link
.
Cette section utilisateur peut être utiliser seule ou en la connectant avec Airtable.
Si vous connecter avec Airtable, vous devez lier la base Airtable, la table Airtable et le e-mail de l'utilisateur. Vous pouvez ensuite sélectionner un colonne pour son nom, lien magique et avatar.

Enfin, il est possible de laisser visible certaines pages à certains types d'utilisateurs, je l'explique plus bas dans la section Membership.
Paramètres
Ces paramètres sont utiles pour l'application en entier.
General

Vous ajoutez le nom de l'app, un sous-domaine Softr, un favicon et vous pouvez enlever le badge Softr pour les plans payants.
Custom domain

Vous ajoutez le domaine personnalisé que vous avez acheté sur Namecheap ou ailleurs.
Integrations

J'en ai parlé plus haut. Ce sont là les intégrations "officielles" avec Softr où vous n'avez pas à ajouter de code dans le header de l'app.
SEO

Je vous conseille fortement d'ajouter votre ID Google pour utiliser Google Search Console.
Cela sert, entres autres, à analyser vos requêtes et pages les plus populaires.
Custom code

Tel que vu précédemment pour les pages, vous pouvez ajouter du code dans le header et le footer de votre app Softr.
Email signature

Si vous avez des utilisateurs, vous pouvez modifier le nom et l'email pour l'envoie des emails.
Il y aussi les Users groups
, Permissions
et SAML Configuration
que je vais parler plus bas dans la section Membership.
Blocks
Les blocks sont les composantes à ajouter dans l'app ou le site web.
Il est possible de changer le design de tous les blocks en cliquant sur l'icône de styles.
Il est aussi possible d'ajouter un block sur un autre page web que Softr avec la fonction embed
.
J'ai remarqué quelque chose de super pour sauver du temps. Quand je modifie le style d'un button
et que j'en ajoute un 2e, il aura le même style que le premier.

Static
Les blocks statiques sont ceux qui se retrouvent dans toutes les apps et sites web.
Ce sont sensiblement les mêmes composantes que vous retrouverez chez les autres outils no code. Alors, vous ne serez pas perdu si vous avez de l'expérience avec une alternative.
Les blocks statiques sont : header
, hero
, feature
, feature grid
, CTA
, partner
, gallery
, pricing
, team
, testimonial
, FAQ
, footer
, custom code
et other
.
Dynamic
Les blocks dynamiques sont basés sur votre base de données Airtable ou vos utilisateurs.
Les blocks dynamiques sont : form
, user accounts
, payment
, list
, list details
, table
, calendar
, kanban
, chart
et map
.
Membership
Membership
Visibilité
Vous pouvez modifier la visibilité des pages et des blocks de votre app.
Il faut tout d'abord ajouter les groupes d'utilisateurs.
Par exemple, dans le portail client, il y a plusieurs groupes où des pages seront accessibles en fonction de leur rôle.


Une fois la visibilité ajouté pour un block, vous verrai un cadenas.

Pour les paiements, c'est dans la section Integrations
> Stripe Checkout
.
Comme dans Stripe, vous pouvez permettre les utilisateurs de Softr de s'abonner mensuellement ou payer une seule fois.
Avec les conditions, il est facile de segmenter les utilisateurs pour chaque produit.

Filtres
Pour les blocks dynamique tels que List
, Table
, Calendar
, Kanban
et Chart
, il est possible d'ajouter des filtres pour déterminer qui peut voir les données en fonction de conditions.
Pour notre portail client, il est facile de faire en sorte que les clients, consultants et managers ne voient que leurs projets.
Il suffit de déterminer le match à any
et le client email
is
people email
puis la même chose pour les autres groupes d'utilisateurs.

Permissions
Softr permet aux utilisateurs de modifier les données directement dans l'application, sans passer par Airtable.
C'est là où l'intégration puissante prend tout son sens !
Il est possible pour les utilisateurs d'éditer les blocks List
, List Details
et Table
.
Comme toutes les autres fonctionnalités, c'est très simple et intuitif de régler les permissions.

Une fois fait, les utilisateurs ayant accès pourront éditer les données en cliquant sur l'icône de crayon.

Conclusion
Voilà, j'espère que vous avez aimé ce guide.
Softr est un outil que j'adore.
N'hésitez pas à l'essayer pour votre projet de web app, vous ne serez pas déçu.
Vous aimez cet article ? Partagez-le à un•e ami•e. Ça ne prend que 10 secondes. L'écrire me prend 10 heures. Vous pouvez aussi m'offrir un (ou plusieurs) Latte glacé 🥤, ça m'aide à écrire plus !
Les liens dans cet article qui mènent vers softr.io et contournement.online sont des liens d’affiliation. Si vous achetez un abonnement, il ne vous coûtera pas plus cher, mais je recevrai une petite commission qui non seulement soutient mon travail (~ 10h/article de recherche & écriture), mais m'aide aussi à faire de Non Codeur un side project durable.