## Rappel sur le concept du projet

Je dois faire un builder de convertisseur en **WYSIWYG** c'est à dire que le comportement du programme se défini visuellement. Les utilisateurs seront donc en mesure de faire des modifications en fonction de leur besoin. 

On va passer par une étape d'**upload** de fichier, puis on aura le choix entre un convertisseur existant que l'on a déjà créé, ou de le faire soi même via une interface **Drag and Drop**.

L'utilisateur verra alors une liste des colonnes détecté automatiquement depuis le fichier **uploadé**, et pourra lui même construire son rendu grâce à des outils affichés directement dans l'interface.

On construit un convertisseur qui sera focus sur une seule ligne du fichier, et l'exécution du projet va générer le fichier entièrement en bouclant ligne par ligne sur notre moteur de conversion.

### Les outils utilisés

J'utilise pour cela des librairies tels que:
- **beautiful-react-diagrams**
- **tailwind** 
- **react-toastify** 

J'essaye d'aller le plus vite possible avec de l'existant afin de ne pas recréer la roue.

Le projet est fait en: 
- **Bun** engine
- **Next.js** **Typescript**
- **MongoDB**

### Les difficultés

J'ai déjà rencontré plusieurs difficultés à ce stade:

- Mettre en place la lecture de fichier **CSV**, **EXCEL** etc... ne fonctionne pas comme avec un Node.js standard, le fait d'être en module **ES** change énormement le comportement du code à la compilation. Il faut donc apprendre à faire de la configuration (du filesystem) notamment afin de ne pas avoir de bug à la compilation.
- Gérer le state avec une librairie de rendu temps réel n'est pas une mince affaire. On arrive rapidement à des conflits de render ou des render loop. Il faut donc apprendre à buffer les changements afin de dispatch un state qu'au moment opportun. Je ne suis pas encore 100% parfait sur ce point, mais j'ai suffisamment stabilisé le tout pour pouvoir avoir une savestate à toutes les actions clées depuis l'interface:

![fix_save_state.gif](https://bo.dev-freelance.fr/uploads/fix_save_state_4f8a69651d.gif)

- Je dois encore gérer des parties dont je n'ai toujours pas designé le comportement, par exemple: mettre en place un hook après génération de la ligne qui lui même aura un flow custom.

### Ce qu'il reste à faire

- Gérer la sauvegarde des convertisseurs
- Créer un worker de convertisseur et un système de queue
- Gérer des comptes utilisateurs
- Gérer des systèmes de licence
- Intégrer Stripe
- Faire une landing page

Voilà en gros de quoi m'occuper encore un moment, lorsque je vois la todo list... 😂 Mais pas de panique, il faut savoir s'organiser correctement et prendre le temps de construire quelque chose de robuste.



large_Projet-WIP.jpg

medium_Projet-WIP.jpg

small_Projet-WIP.jpg

thumbnail_Projet-WIP.jpg

Projet-WIP.jpg

Je vous parlais dernièrement de la remise sur le tapis du projet convertisseur de relevés bancaires pour comptable. Ayant été relancé mainte et mainte fois sur ce besoin, j'ai décidé d'en faire un outil un peu plus pratique. 

Projet convertisseur wip update 1

## Pause temporaire du projet facturation

Parfois je suis obligé de mettre [le projet sur lequel je suis](https://dev-freelance.fr/projets/projet-factures-wip-update-1) en **Stand-By**. Vous imaginez bien, lorsque les demandes arrivent je dois évaluer ce sur quoi je vais investir un peu de temps car ce qui prime c'est la rentabilité.

Le projet facturation servant uniquement mon besoin personnel, il me sera utile dans le futur mais n'est pas intéressant à court terme. Aussi, lorsqu'un besoin arrive, je me dois de poser la question: est-ce que je suis payé pour le faire?

### On reprend le projet de conversion de relevé bancaire

Ce projet consiste à convertir des fichiers de relevés bancaires **XLS**/**CSV** en un fichier compatible à l'import dans les logiciels comptables.

Aussi, le projet existant dont je vous avais parlé [ici](https://dev-freelance.fr/news/je-cree-un-convertisseur-de-releves-bancaires-pour-un-expert-comptable) a beaucoup évolué depuis.

Mais à un moment il faut se faire une raison, les types de fichiers ne vont faire que grossir dans le temps, si le nombre de banque (surtout néobanque) augmente, où si les banques font évoluer leur modèle de fichier.

Ce qu'il convient de faire **c'est un convertisseur de fichier qui évolue avec le temps** que j'intervienne ou non. Et pour celà, j'ai décidé de mettre en place une nouvelle approche.


### Une approche builder

Plutôt que de coder en dur les convertisseur et les faire évoluer en fonction du besoin des utilisateurs, j'ai opté pour un projet qui permettra aux utilisateurs d'être autonome et de faire évoluer eux même leur convertisseur.

**Ce que j'aimerais coder:**
- Un builder de convertisseurs partagé pour une compagnie
- Nommer et sauvegarder les convertisseurs 
- Gérer des licences par compagnie
- Le builder sera en drag and drop et se voudra simple d'utilisation

**Ce que j'ai déjà codé:**
- lecture des fichiers xls, xlsx, csv
- détection des colonnes mêmes s'ils sont en plein milieu de fichier
- une structure de projet avec **Bun** et **Next.js**
- un aperçu du builder

Donc voilà, le projet n'est encore qu'à ses débuts mais je me fixe un horizon de temps assez court pour le faire, je dirai quelques semaines tout au plus.

Pour vous donner une idée:

![fileConverter.gif](https://bo.dev-freelance.fr/uploads/file_Converter_38a53c2174.gif)

Voilà en tout cas, j'adore ce projet, je suis excité rien qu'à l'idée de le faire évoluer fonctionnalité par fonctionnalité. C'est une super cas d'école pour prendre en main les diagrammes sur **React**.


large_convertisseur-xls.jpeg

medium_convertisseur-xls.jpeg

small_convertisseur-xls.jpeg

thumbnail_convertisseur-xls.jpeg

convertisseur-xls.jpeg

Bon ! C'était prévisible, même si je sais que c'est un vrai problème pour les développeurs, je suis souvent défocus. Mais j'essaye de peser le pour et le contre et de voir si ça vaut le coup de mettre en pause ce que je fais. 

Interruption de projet

## La création de facture

Ce n'est pas un sujet nouveau, lorsque l'on vend quelque chose, il faut bien le facturer. Aussi, les solutions de facturations existent déjà, oui c'est bien possible, mais tous ont quelque chose en commun. Ils font quelque chose pour des gens qui ne veulent pas le faire eux-même... C'est aussi simple que ça. 

Alors pourquoi ne pas lancer sa propre solution ?

J'ai plusieurs raisons qui me poussent à coder mon SaaS de facturation:

- Premièrement, j'ai besoin de facturer ce que je fais comme applications etc, donc c'est réutilisable
- Deuxièmement, il y a plein de sujets que je trouve intéressant d'aborder en faisant ce projet: travailler l'**UX** via une interface simple et intuitive en **React**, faire un worker de génération de **PDF**, mettre en place tout un projet **SaaS** commercial de A à Z car ça fait un moment que je ne l'ai pas fait.

### Où en est-on ?


#### Header

Les date pickers sont mis, on peut sélectionner les date et deadline de la facture, ainsi que le client à qui la facture est destiné.

![PickDate_PickCustomer.gif ><](https://bo.dev-freelance.fr/uploads/Pick_Date_Pick_Customer_504fd23300.gif)

#### Lignes

On peut ajouter des lignes, mettre les prix et les calculs de totaux et TVA se font automatiquement.

![AddItems.gif ><](https://bo.dev-freelance.fr/uploads/Add_Items_a025b867ab.gif)

#### Remise

On peut ajouter des remises en valeur ou en pourcent.

![AddDiscount.gif ><](https://bo.dev-freelance.fr/uploads/Add_Discount_bfa82b23e3.gif)

#### Tri

On peut modifier l'ordre des lignes via drag and drop.

![SortItems.gif ><](https://bo.dev-freelance.fr/uploads/Sort_Items_74891d9a3a.gif)

### Que nous reste t-il à faire ?

Il nous reste encore beaucoup de choses à faire comme:

- l'autocomplete produit, la possibilité d'ajouter un nouveau client
- générer le fameux **PDF**
- gérer les paiements **Stripe**
- gérer les comptes utilisateurs
- l'historique de pièces commerciales
- etc...

Mais comme moi et mon épouse, nous recevons de la famille en ce moment à la maison, je passe un peu moins de temps à coder. Je pense que prochainement, je vais pouvoir me mettre dessus à 200% et ça sera plié.

On parle de mon projet SaaS, de comment il évolue. Je travaille en ce moment sur la création de pièces commerciales en ligne. C'est un sujet déjà vu, mais quoiqu'il en soit j'en ai besoin dans mes projets perso, c'est pourquoi je travaille sur une brique réutilisable dans tous mes autres projets.

Découvrez tous nos articles de la catégorie Projets - page 1 sur 1

Projet convertisseur wip update 1

Interruption de projet

Projet factures wip update 1