Il existe énormément d’exemples de revenus passifs, mais tous rentrent dans les 4 catégories suivantes.

Immobilier

L’immobilier est sans doute le type de revenu passif le plus répandu. Quelques exemples :

• location nue ou meublée
• location saisonnière / location Airbnb
• Colocation

Revenus financiers

Il s’agit la plupart du temps de revenus de portefeuille (dividendes), provenant des marchés boursiers.

• Lending Club / Peer to peer lending platforms
• High Yield Savings Accounts
• ETF / index funds
• Invest in real estate investment trusts (REITs)
• Purchase high dividend stocks

Royalties

Il s’agit de tous les revenus liés à vos créations, et qui vous verse des droits d’auteur ou génère des revenus résiduels : livres ou ebooks, musique, logicels, etc…

• Vente d’un logiciel / d’une application mobile
• Création d’un cours / d’une formation en ligne
• Vente d’un livre / d’un e-book
• Création de vidéos Youtube
• Vente de vos photos

Business Automatisés

Popularisés par le livre de Tim Ferris, La semaine de 4h, les « muses » sont la plupart du temps des sites eCommerce de niche.

Aujourd’hui, j’aimerais vous présenter 10 niveaux de l’indépendance financière. Très souvent, les gens pensent que pour atteindre l’indépendance financière, il faut toucher beaucoup d’argent d’un coup, et devenir financièrement indépendant en une seule étape. En réalité, ce n’est pas comme ça qu’on y arrive. Il y a beaucoup de petites étapes à franchir. Je vous présente ici un découpage en 10 étapes, qui permet de rendre chaque étape plus accessible.

Niveau 1 : La faillite

Niveau 2: La dépendance financière

La plupart d’entre nous démarre à ce niveau. Nos parents s’occupent de tout et nous sommes dépendants: on ne gagne pas d’argent, mais on dépense le leur !

Niveau 3: À l’équilibre (peut payer ses factures)

Au début de votre vie professionnel, votre premier salaire suffit à payer vos dépenses courantes: le loyer, la nourriture, les factures d’eau et d’électricité etc…

Beaucoup de gens peuvent passer toute leur vie à ce niveau, car malgré un salaire de plus en plus important, leur niveau de vie augmente, ils achètent une plus grosse voiture, une plus grande maison, et le salaire se retrouve entièrement dépensé.

Niveau 4: Plus de crédit à la consommation (cartes de crédit, prêt personnel ou crédit auto)

Si vous n’avez plus de crédit à la consommation, alors vous êtes au niveau 4. Félicitations, vous êtes déjà à un niveau supérieur à la majeure partie de la population !

Niveau 5: Plus de crédit étudiant

Si vous avez fait de longues études, vous vous êtes peut être endetté pour payer vos années de formation. Si vous aviez des parents riches qui ont soutenu votre dépendance, un petit boulot pour payer vos années d’études ou bien que vous avez enfin remboursé tout votre crédit étudiant, alors vous êtes au niveau 5.

Niveau 6: Plus de crédit immobilier

Atteindre ce niveau demande généralement plus d’effort ! Imaginez ne plus avoir le remboursement de votre résidence principale à charge sur votre budget.

Si vous n’avez pas remboursé entièrement votre crédit, mais que vous disposer de plus d’épargne que le capital restant dû, vous êtes également au niveau 6. Cependant, il n’est pas toujours préférable de rembourser le crédit, notamment si le rendement de vos placements financiers est supérieur au taux de crédit, ou si vous souhaitez garder du cash pour investir dans de nouvelles opportunités, ou tout simplement en tant que matelas de sécurité en cas de coup dur.

Niveau 7: Accumulation

Si vous n’avez plus du tout de crédit, et que vous travaillez toujours, alors vous êtes au niveau 7. Vous accumulez alors de la richesse à un niveau alarmant et tout le surplus par rapport à vos dépenses courantes part en épargne ou en investissement.

Vous n’êtes pas encore indépendant financièrement, mais les actifs dont vous disposez commencent à rapporter. Votre valeur net progresse régulièrement.

Niveau 8: Sécurité financière (paye toutes les dépenses courantes)

Si les revenus de vos placements couvrent l’ensemble de vos dépenses courantes (nourriture, logement, factures, assurances, vêtements, voiture, etc…), alors vous avez atteint la sécurité financière.

Niveau 9: Indépendance financière (soutient votre niveau de vie actuel)

À ce niveau, les revenus de vos investissements couvrent l’ensemble de vos dépenses. Y compris: sorties, loisirs et vacances !

Niveau 10: Liberté financière absolue

Au niveau 10, vous avez tellement d’argent, que les revenus du capital couvrent l’intégralité de votre niveau de vie actuel plus un surplus.

La question devient alors: qu’allez-vous faire de ce surplus ? Faire des donations tous les mois ? Démarrer un nouveau projet, une nouvelle entreprise ? Lancer une fondation ?

Attention ! Ces niveaux sont inventés pour vous situer sur le chemin de l’indépendance financière, et définir votre prochaine étape. La réalité est souvent plus complexe :

• l’ordre de remboursement de vos crédits peut s’effectuer dans un ordre différent de celui présenté
• si vous êtes très mobile, vous pouvez décider de ne pas devenir propriétaire de votre résidence principale, et sauter complètement l’étape 6

J’espère que ces étapes vous encouragerons à réfléchir à vos prochains objectifs, et que cela les rendra plus accessibles ! N’oubliez pas qu’il n’existe pas de plan valable pour tout le monde, mais que sans plan, vous n’atteindrez pas vos objectifs.

Cet article est inspiré d’une vidéo réalisé par BeatTheBush, Youtubbeur américain. Retrouvez sa vidéo ici.

Avant de vous lancer dans tout projet d’investissement, il est indispensable de vous constituer une épargne de précaution.

Si vous souhaitez construire un capital de manière durable, il faut être capable de ne jamais y toucher, afin de bénéficier de la magie des intérêts composés et d’utiliser au mieux les avantages fiscaux.
Or la vie réserve parfois des surprises et pour faire face à des imprévus ou anticiper des dépenses exceptionnelles, il est nécessaire de disposer d’une épargne sûre et accessible à tout moment.

Où conserver mon épargne de précaution ?

L’épargne de précaution doit respecter 2 critères :

• Disponible : vous devez pouvoir faire un virement sur votre compte courant très rapidement
• Sûre : pas ou peu de volatilité ( vous ne choisissez généralement pas le moment ou vous en aurez besoin ), faible risque

À ce titre, les livrets réglementés comme le livret A, le livret de développement durable (LDD), le livret d’épargne populaire (LEP) ou le compte d’épargne logement (CEL), ainsi que les livrets bancaires sont tout indiqués.

En revanche, leur rémunération est souvent faible, et protègent à peine (ou pas !) de l’inflation, c’est pourquoi il n’est pas optimal de mettre plus que nécessaire sur ces supports.

Quel doit-être le montant de mon épargne de précaution ?

Selon votre situation, il est généralement recommandé de conserver une épargne allant de 3 à 6 mois de revenus du foyer.

Par exemple, pour un couple sans enfant gagnant 4000€ / mois, une épargne de précaution de 20k€ (5 mois de revenus) paraît tout à fait raisonnable.

Combien dois-je épargner ?

Une fois l’objectif du montant de votre épargne de précaution fixé, vous pouvez vous fixer des règles de gestion assez simples, par exemple :

• Si votre épargne est inférieur à votre objectif, rediriger tout le surplus mensuel vers l’épargne de précaution
• Si l’objectif d’épargne est atteint, vous pourrez alors sereinement investir dans d’autres projets, ou épargner sur un compte différent pour un projet vacances par exemple.
• Si vous devez réellement besoin de votre épargne à un moment, les investissements seront mis en pause le temps de reconstituer l’épargne

Bien entendu, cette stratégie est très conservatrice, mais elle vous permettra de dormir sur vos deux oreilles !

Je n’arrive pas à épargner !

Dans le cas où il vous faudrait des années pour constituer cette épargne de précaution, c’est sans doute que vous vivez au-dessus de vos moyens, ou bien que vous maîtrisez mal votre budget. Pour vous donner un point de référence, en épargnant 15% des vos revenus chaque mois, il faut 20 mois pour épargner 3 mois de revenus.

Une fois calculé, ce montant peut simplifier votre réflexion d’achat ou de sous-traitance (dois-je payer un comptable ? combien suis-je prêt à payer pour ce service ? etc…)

Comment calculer votre profit sur temps investi ?

Le calcul est extrêmement simple en principe :

Profit sur temps investi = Revenu / Nombre d’heures investies

Attention : Il faut bien distinguer le montant brut, du montant net, et même du montant net net (c’est à dire après impôts sur le revenu) pour pouvoir comparer différents projets entre eux !

Par exemple, pour les personnes au SMIC, le montant brut est défini par décret du gouvernement à 9,88€ / heure (en 2018), soit 7,61 € net / heure.

Autre exemple, pour un salarié cadre à 60k€ brut / an sur 12 mois, cela nous donne 32.96€ brut / heure, et 24.72€ net / heure. (vous pouvez utiliser le calculateur suivant si vous êtes salarié)

Le calcul net net n’est lui pas généralisable, car il dépend du montant de votre impôt, et donc de l’ensemble des revenus de votre foyer et de votre situation fiscale. Cependant, je vous incite très fortement à faire le calcul, car c’est ce montant net net (l’argent que vous avez réellement à votre disposition) que vous pourrez comparer à vos dépenses personnelles !

Comment le calculer si vous n’échangez pas votre temps contre de l’argent ?

Dans le cas où vous n’êtes pas salarié, si vous avez des revenus complémentaires ou bien pour des projets entrepreneuriaux, le calcul n’est pas aussi simple.

Vous devez prendre en compte l’ensemble des revenus, des impôts, et du temps passé pour avoir un chiffre précis.

Si par exemple vous revendez votre entreprise, vous ne pourrez le connaître qu’une fois le montant de la vente connu.

Dans le cas d’un livre ou bien d’un eBook sur lequel vous touchez des droits d’auteurs, il faudra alors calculer la « Lifetime-Value » (LTV), c’est à dire la somme des revenus générés sur toute la durée de vente.

Le facteur psychologique

Une fois ce montant calculé, il est intéressant de s’interroger sur nos biais psychologiques, et d’identifier les points où nous n’agissons pas de manière rationnelle.

Pour vous aidez, voici quelques exemples de questions à vous poser :

• Quel salaire seriez-vous prêt à accepter pour un temps partiel à 80% ?
• Combien seriez-vous prêt à payer pour une heure de ménage ? de travaux ?
• 1h30 de transport en commun pour 1,90€ ou bien 30min de taxi pour 25€ ?
• etc…

Maintenant, comparez ces choix à votre profit. Je vous laisse maître de l’interprétation des écarts que vous pourrez constater, mais les conclusions que vous pourrez en tirer devraient tomber dans l’un de ces deux cas :

• Est-ce que je ne pourrais pas déléguer cette tâche / faire cet achat pour me concentrer sur des tâches à plus forte valeur ajoutée ?
• À l’inverse, est-ce que je ne pourrais pas faire cette tâche / ne pas faire cet achat pour économiser de l’argent ?

Les facteurs compétence et apprentissage

À ne pas oublier: Certaines activités que vous faites ou que vous déléguez ont une valeur supplémentaire à leur réalisation !

Souvenez-vous qu’une des règles de la liberté financière est l’investissement en vous et vos connaissances ! Apprendre à effectuer une tâche, même si ce n’est pas rentable en terme de temps, peut se révéler à la longue beaucoup plus intéressant que de ne jamais la faire, et de ne pas apprendre. Pour cette raison, il peut parfois être préférable de ne pas tout déléguer trop tôt…

À l’inverse, certaines tâches nécessitent expérience et expertise (comptabilité, plomberie, électricité, etc…), même si ce n’est pas toujours visible dans le résultat. Par exemple, considérez un comptable dans une entreprise, à jour des nouvelles lois, et pro-actif sur les moyens de gérer les amortissements ou les réductions fiscales, par rapport à un entrepreneur qui ferait sa comptabilité lui-même. Les risques encourus à réaliser une tâche pour laquelle vous n’êtes pas expert sont donc également à prendre en compte !

Synthèse

En tant qu’investisseur ou entrepreneur, l’allocation de votre temps est critique. Comme pour un investissement financier, vous pouvez faire effet de levier sur votre temps grâce à la délégation. Connaître votre profit net sur temps investi peut simplifier votre prise de décision.

Et vous, qu’allez vous changer ? N’hésitez pas à proposer vos idées de changement dans les commentaires ci-dessous !

Pour aller plus loin sur le sujet, je vous recommande la lecture de ces deux excellents livres : Tim Ferris, La semaine de 4h et Michael E. Gerber, E-myth : le mythe de l’entrepreneur revisité.

Exemples et limitations

Zapier vous permet d’automatiser vos tâches répondant au schéma classique : Déclencheur > Action. Par exemple :

• Publier un nouvel article WordPress sur Facebook ou Twitter
• Enregistrer des pièces jointes de vos emails dans Google Drive ou Dropbox
• Enregistrer le contact d’un formulaire Typeform en tant que Lead sur Salesforce
• etc…

Depuis quelque temps, Zapier propose également l’enchaînement de plusieurs actions, ce qui permet par exemple des scénarios de multi-diffusion (diffusion multi-canal)

Une série de connecteurs orientés Business

Très semblable à IFTTT sur le principe, Zapier propose également un grand nombre de connecteur “Business” destinés aux entreprises. La plupart d’entre eux nécessite un abonnement “Premium” (à partir de 20$ / mois)

Création d’un connecteur vers votre application

Le moyen le plus simple de connecter n’importe lequel des vos applications à Zapier est d’utiliser la fonctionnalité Webhook.

https://zapier.com/developer/documentation/v2/

Visual scripting for the web, Pipes for hackers, using Node.js, and mongoDB
WebHookIt is kind of an open-source Yahoo! Pipes, but with a wider scope of applications. The idea is to have a very HTTP-centric visual language to write glue-code between web-services using Node.js.

It’s made to be customized/modified/enhanced :

• easily add core modules (written in Node.js)

• customize UI (forms and modules, using WireIt and inputEx)

• customize the execution engine

• composability, reuse modules
  It’s perfect for :

• Notifications (email, sms, IM, social networks)

• services integration and communication

• plugins for web applications (Webhooks)

• chaining web-services

• providing simple webservices
  It’s not a hosted service like Yahoo! Pipes, but you can install it on your local machine, your servers, on Joyent Node.js SmartMachines, and maybe even on your Palm Pre devices (lucky you!)

We are not there yet

This first version of WebHookIt is still alpha software. APIs may change and some basic features are still missing. Those are going to be adressed in the first stable release :

• loop control
• conditional execution
• Community, pipes sharing, leverage the pre-existing package manager npm

All the links

• The online demo : http://webhookit.no.de (hosted @Joyent)
• Source obviously hosted on GitHub
• The documentation uses the awesome GitHub pages
• Forum here
• Report any Issue on GitHub issues

Here is a video of WebHookIt in action against the Prowl API : (sorry for the music… it won’t happen again !)

YUI Builder contains the component build tool, which is the ANT based build system YUI uses to generate the code in the YUI 2 and YUI 3 build directories, from the contents of the src directories for each component.
Ok, looks cool to me. But what this description doesn’t mention, is that you can use the Builder for your projects too ! The documentation is precise and concise. The YUI Builder has a lot of nice features, however, it comes at a price :

Drawbacks

• **requires a bigger stack **: you’ll need java, ANT, and YUI Builder to be installed. While most developers should have those tools already installed, open-source projects may suffer contribution-loss for having such a deep stack to install, understand and configure. Hopefully, for existing components, a simple _ant all _will work.

• build step : For each modification, you’ll have to re-build the component. I strongly recommend to have some kind of IDE integration. Obviously, ANT and Java were chosen for a good reason: auto-building in Eclipse is a breeze. If you are a Textmate user, here is a simple command to launch ANT.

• build files to create when adding a new module : build.properties, build.xml, create the directory structure, setup the test files, etc… But this is kind of a stupid task: some tool could help with that ! (read on !)

Advantages

• _Structure _: Your modules will have the same structure as YUI components. Those conventions will help you organize your files, ensuring homogeinity through your project. This should also make it easier to understand for existing YUI users.

• JSlinting every module : you’ll be surprise how many errors you can catch before trying your code in the browser… Although your IDE probably already runs JSlint on each save, it is good to know that this step is mandatory in your workflow even for notepad addicts.

• Minification : YUI compressor is built-in. You don’t need to even think about it.

• Module dependencies : When I started porting my librairies to YUI3 without using the YUI Builder, I spent quite some time setting up the dependencies of each module, because I needed to update it twice: in the module declaration and in the loader seed file. Using the YUI Builder removes this redundancy by declaring the dependencies only once in the build.properties file. The loader seed file can then be automatically generated. (more about this in the yproject paragraph.)

• Deploying to the YUI gallery (optional): The YUI gallery is the place to make your YUI contributions public, leveraging the Yahoo! CDN. All components in the gallery are automatically built with the YUI Builder.

yproject - With a Little Help from My Friends

yproject is a command-line utility to scaffold projects and components using the YUI3 library and the YUI Builder. It is open-source, and hosted on github. It tries to fill some gaps left by the YUI Builder.

It contains a project template and a module template to quickly bootstrap your project enforcing best practices from the start :

• loader module for dependencies : the YUI library loader component is automatically generated using a script called meta_join.py. yproject provides a similar script : read the build.properties files, and generate a myproject-loader seed file which will dynamically load all your dependencies.

• testing with YUI test and Selenium : the yproject template provides scripts to generate the tests.xml file and launch them all with Selenium.

• test coverage : the tests will by default run the instrumented code, and generate a code coverage report at the end of the Selenium batch run.

• _documentation _: the created project already contains a script to launch YUI Doc, and generate the API documentation into the api/ folder
  yproject requires node.js. You can install using npm : npm install yproject

Read more on https://github.com/neyric/yproject

How to organize components

A last question remains: how should I organize my components ? At first glance, it seems to be a compromise :

• on one side, you can bundle a lot of functionality into one file to improve performance, limiting HTTP requests.

• on the other size, smaller components are easier to test and re-use.
  However, YUI has two features, which make this decision a no-brainer :

• Combo-loading : Available from the Yahoo! CDN or using YUI PHP loader. This will combine multiple files into one HTTP request and cache it, making the next request insanely fast. I hope we will soon get a Rails plugin and a Node.js package to do the same…

• Rollup files : If you often use a set of component together, you can configure rollup components to build them all into a bigger component, limiting the HTTP requests.
  So my final advice is the following :

Do as many components as you can ! Split them all into smaller pieces !

This will ensure reusability, easier testing, easier debugging etc… In short: true engineering practices.

Conclusion

YUI3 + YUI Builder is definitely harder to get started with, than any other Javascript library framework. But none can compare to the professional development workflow it provides. If you are targeting high quality standards, performance, well-documented projects, test-driven development and reusability, it really worth the trouble.

Be professional: use YUI Builder and yproject !

inputEx 0.7.0 was released today !

Most importantly, we upgraded YUI dependency to version 2.8.2r1 to fix security issues, and fixed a major bug for Internet Explorer 9.

We also worked on setting correct names for all sub-fields in order to use classical browser form posting. You can now safely use Group and List fields using standard forms.

Finally, I merged all the various Wiki pages we had into the new inputEx Guide. Obviously far from being complete, this first version will help us replying to questions from the forum, and hopefully help newcomers.

You can take a look at the complete changeset here, and download the 0.7.0 version here.

inputEx Roadmap

Now, where are we going ?

With the upcoming YUI 3.3.0 release, it is now time to seriously work on upgrading inputEx to YUI3.

Of course, this is not a new idea, and we’ve already tried to start the project over, leveraging the YUI 3 widget infrastructure. However, this appeared to be a huge amount of work, while throwing away most of the current code.

Facing our failure, we’ve decided to take a smaller step to get there, so we’ll start by forking the current version to make it work with YUI3, using yui2in3 for widgets dependencies, while keeping code changes to the strict minimum.

Once this version is out, we’ll be able to continue with the following goals in mind :

• remove unrelated code from the library (yql-related stuff, JsonTreeInspector, …)
• removing YUI2 dependencies while widgets get integrated into YUI3
• make inputEx available on the YUI gallery (and leverage Yahoo! CDN )
• finally use the YUI Widget framework
  You will be able to follow the progress of the inputEx-yui3 branch on https://github.com/neyric/inputex/network.

Happy new year !

Bonita Open Solution is an open-source Business Process Management ( BPM ). It comes with one of the best BPMN editor I have tried (Bonita Studio). The main feature of Bonita, is its extensibility, which is achieved by using either :

• Connectors: java classes which defined the task to run, as well as the interface to configure the connector from within Bonita Studio
• Scripts: Using Groovy scripts or Javascript through the Rhino connector
  In this example, I will show how to use a Groovy script to access Salesforce query interface, but the process described here is pretty much the same for all Java librairies you may want to use from Bonita.

First, we need to generate the JAR file for your Salesforce organization. We’ll use the Force.com Web Service Connector (WSC), which generates the JAR file from your Enterprise WSDL:

• Download the latest WSC JAR
• To get your WSDL, log into your organization and go to Your Name -> Setup -> App Setup -> Develop -> API. Generate the enterprise WSDL (unique to your organization) and save it as salesforce-mycompany.wsdl
• Open a console, and run the WSC tool :

  java -classpath wsc-20.jar com.sforce.ws.tools.wsdlc \   salesforce-mycompany.wsdl salesforce-mycompany.jar

  Now, open Bonita Studio and import the two JARs (Extensions -> Add/remove)

Then, we’ll design a simple process. The first task ‘Query on Salesforce’ will perform the SOQL query on Salesforce, and format the results into human-readable HTML. The second task ‘View results’ will just present the results to the user into a form.

In the first task, add a Groovy Script Connector and enter the following script :

Save the result of the script into a new data variable called ${result}.

Finally, add a form to the second task. Insert a Text field, and sets its default value to the ${result} variable created above.

Run the process and voilà !

I’ve also been using the same scripting capabilities to post articles to my blog using XML-RPC through the wordpress-java library and it worked like a charm !

Which libraries are you gonna use ?

Harvard Air Taxi offers on-demand air transportation services from Massachusetts

Peut-être que le pilote de cette nouvelle compagnie aérienne vous semblera familier ;)

Tous mes articles français ont été déplacés sur http://fr.neyric.com. Cela vous laisse choisir les flux que vous souhaitez lire. Mettez à jour vos lecteur de flux !

I’m pleased to announce the latest version of WireIt, namely 0.5.0.

This release had 2 major goals:

• Enhance the WiringEditor
• Documentation documentation documentation
  The WiringEditor received a lot of attention: by providing a full-page
  editor, people have been able to start prototypes very quickly for
  their projects. However, we needed to improve the way we connect this
  editor to the backend, and that’s what we’ve done, through “adapters”.

I’m even very proud of this idea because… it’s not mine ! Big thanks to this insightful comment from Jonathan Lister and hurray for open-source communities!

Concerning the documentation, although we already had a full API
documentation and many examples, it was still missing some guidelines.
I therefore wrote the WireIt guide: http://javascript.neyric.com/wireit/guide.html

Of course, we also have some minor improvements :

• the new InOutContainer
• Wire mouse events
• some experimental layout options
  You can view the complete changeset at:

http://javascript.neyric.com/wireit/VERSION.txt

And of course download the library from the home page: http://javascript.neyric.com/wireit/

Have fun !
Eric

What’s new in version 0.4.0 ?

• inputEx integration: inputEx is another of my YUI libraries, to create fields and forms. Through a new class called “FormContainer”, you can now build WireIt containers using the advanced forms options from inputEx. The value is saved at the layer level for you through Layer.getWiring

• WiringEditor: This is my favorite feature. While still largely incomplete, the Wiring Editor provide a full-blown interface to create visual languages. It takes care of most of the interface you might want to build a visual editor on top of WireIt. The language definitions are written in JSON, I hope this will greatly reduce the learning curve of WireIt.  The transparent ajax communication with the database is handled through a SMD webservice using YUI-RPC. WireIt provides a simple php backend that stores the JSON wiring states in MySql (used for the demos on wireit’s website).

• new options:

  • terminals position in containers: {top: , left: , right: , bottom: } instead of [x,y]
  • Terminal.alwaysSrc : force this terminal to be the source element in every connected wires
  • Container.preventSelfWiring : prevent connections between two terminals of this container

• Four Wire methods for handling mouse events. You can override them for a custom use :

  • onWireClick
  • onWireIn
  • onWireOut
  • onWireMove

• API Documentation with YUI Doc (much more precise on properties and events)

• Layer Map is now clickable and draggable. It will move the linked layer accordingly.

• IE Bug fix ! (finally)

• Moved to github for git repository and better wiki

  **Build visual languages applications !**
  It's now pretty easy to build visual languages applications. (or at least, prototype them...).

You can follow some projects on http://github.com/neyric/wireit/network. I’m especially looking forward to LeifW XProc Visual Editor

Here is a little presentation that I published on WireIt’s homepage :

Although we didn’t add any new field in this release, inputEx 0.2.2 still brings a new set of options and bugfixes. (see the changeset for details)

The most significant part of this version, which I’m pretty excited about, resides in the following components :

• improved JSON-schema support (example one and two)
• yui-rpc: A Service Mapping Description (SMD) client for YUI, based on the SMD Proposal
• inputex-rpc: automatically builds a form from a SMD
• JsonTreeInspector widget: simple widget to display a JSON tree
• The SMD-tester utility

YUI-RPC or “What the heck is Service Mapping Description (SMD)” ?

Abstract from the proposal:

A Service Mapping Description (SMD) is a JSON representation describing web services. An SMD can defines the various aspects of a web service such that clients can coherently interact with the web services. An SMD can be used by generic tools to generate interfaces, human and programmatic, to access available web services. A wide array of web services can be described with SMD including REST services and JSON-RPC services. The SMD format is designed to be flexible, compact, simple, readable, and easily implemented.
SMD is basically a WSDL-like, but for JSON. It’s so much simpler to implement that I regret the time I spent on WSDL ! Instead of using XML, XML-RPC and SOAP, we are now able to play with technologies better suited for the browser environment: JSON, JSON-RPC, REST, JSONP etc…

Concerning the “programmatic interface”, the dojo framework already provides a remote procedure calls module. However, since I’m a YUI-user, I had to re-implement it on YUI, which gave birth to YUI-RPC.

How inputEx is playing with SMD

From the inputEx point of view, the best part of SMD is that the method parameters are defined using… JSON-Schema !

inputEx was already able to build a form from a JSON-Schema, so it was pretty trivial to implement an automated form generation to call webservices based on a SMD. Here is an example of such a form using a SMD for Yahoo! search.

I believe this will help a lot in decoupling interfaces and webservices. To prove my point, I quickly wrote some SMDs for popular webservices like Yahoo! search, pipes, Twitter, geonames, delicious, flickr, YQL and others, and built a tiny interface, the SMD-tester, to build the forms, call those webservices, and display the response.

Have fun !

JSON Schema is a specification for a JSON-based format for defining the structure of JSON data. JSON Schema provides a contract for what JSON data is required for a given application and how it can be modified, much like what XML Schema provides for XML. JSON Schema is intended to provide validation, documentation, and interaction control of JSON data.
There are numerous similarities between inputEx and JSON Schema. If you are not convinced, here is an example of a JSON schema:
`{“description”:”A person”,

“type”:”object”,`

` “properties”: {

“name”: {“type”:”string”},

“born” : {`

` “type”:[“integer”,”string”],

“minimum”:1900,_

_`` “maximum”:2010,

`

` “format”:”date-time”, _

_ “optional”:true

`` },

“gender” : {“type”:”string”,

“options”:[`

{"value:"male","label":"Guy"},

` {“value”:”female”,”label”:”Gal”}]},``

“address” : {“type”:”object”``,

“properties”:{`

` “street”:{“type”:”string”},

“city”:{“type”:”string”},

“state”:{“type”:”string”}

}

}

`

` }

`}
inputEx users should be comfortable writing a form for this schema :
{

type: “group”,

fields: [

{type: “string”, inputParams: {name: “name”, required: true}},

{type: “date”, inputParams: {name: “born”} },

{type: “select”, inputParams: {name: “gender”, selectOptions:[“Guy”, “Gal”], selectValues: [“male”, “female”]}},

{type: “group”, inputParams: {

name:”address”,

fields: [

{type: “string”, inputParams: {name: “street”}},

{type: “string”, inputParams: {name: “city”}},

{type: “string”, inputParams: {name: “state”}}

]    }  }  ] }
The main difference is that the** JSON schema ontology is data-centric, wheras the inputEx JSON schema ontology is form-centric**, but as you can see, they are very similar.

Another similarity is the self-descriptive ability of JSON Schema and inputEx. JSON Schema has its own schema, a schema for itself. inputEx has the same kind of self reference: the TypeField contains forms to describe the options of each field (you can see this at the end of TypeField.js). This self-referencing property has very nice implications: it gives the opportunity to create a form to build forms, and that’s exactly what the inputEx Builder is: a form which outputs inputEx JSON.

inputEx implementation of JSON Schema

In version 0.2.0, I added a (very) light implementation of a JSON Schema to inputEx JSON. Hopefully, Brad Clements saw the advantages of having automatic form generation from JSON schemas and took the prototype one (big) step forward by implementing JSON referencing. We are now able to create atomic schemas and combine them in nested schemas.

At the current state, inputEx doesn’t implement all the validation that can be described in JSON Schema, but we are on the way. On the other hand, inputEx has many options concerning the form interface, that are not necessary in JSON Schema, which focuses on data validation. Brad suggested an extension to JSON Schema by adding an “_inputex” property to type definition. It allows to set the additionnal interface options for inputEx within the schema.

Both of these features are demonstrated in this example which is built from this schema (JSON schema with inputEx extension).

The last feature that we’re missing is the extending capability (“extends”:{“$ref”:”person”}), but the implementation should be pretty straightforward.

**Round-trip: defining JSON-Schema through forms, and **Persevere backend

Up to now, we focused on converting JSON schemas to inputEx forms, but the other way is perfectly conceivable ! Leveraging the inputEx Builder, we would have a nice interface to **build JSON schemas and associated forms at the same time. Combined **with the Persevere framework backend, we could provide a very nice administration interface, that let you edit models through the inputEx Builder, then edit the data through the generated inputEx forms. You could argue that some fields should not be visible in forms, but if you take a closer look at inputEx fields, two of them are perfect for this case: the HiddenField, which is not visible at all, or the UneditableField which lets you use a custom rendering method for an uneditable field.

I think this might end up in a more effective interface than the current Persevere database explorer because it creates the form interfaces at the same time, and make them reusable within your application.

A last idea, we could provide json-schemas for defining method parameters. inputEx could then automatically generate forms to call these methods (through JSON-RPC or locally).

Of course, if you’re interested in the following developments, we urge you to contact us through the forum.

Have fun !

Beyond the usual bug fixes, we received very cool contributions:

• MapField: Thanks to David Janes. It can handle MS Virtual Earth, Yahoo! Maps or Google Maps. It returns the latitude/longitude coordinates but also the zoom level.

• MenuField: Thanks to Maxime Réty. Useful solution using the YUI Menu widget instead of grouping dropdown menus.

• Italian localization by alexodus. If you speak Spanish or German, it will take only a few minutes to translate and post it on the forum.

• Json-schema referencing by Brad Clements. (see below)
  Other things in this release :

• VectorField. I use this one for storing positions or any kind of vectorial information.

• FileField-beta. It only works if you’re using a POST method to submit the form, but might be useful for you.

• The inputEx Builder can now export the generated code to a page, and load a form from a inputEx Json definition or a json schema !

• We also moved the repository to GitHub, although the wiki has not moved yet.
  Click here to view the complete release notes.

Have fun !

We received queries on the inputEx forum to switch our repository to Git.

The YUI library recently moved to GitHub, so I decided to move both of the YUI-based libraries, inputEx and WireIt, to the same plateform.

Here are the two new repositories: inputEx and Wireit.

The GitHub interface is friendly, it displays nice stats, has a cool API, and Git ! (But I’m missing a ticket system)

The good news is that it is really easy to import a SVN repository, and keeps the commit history.

See you on GitHub !

Ah… and Happy New Year !

This version of_ the YUI-based json form framework_ brings a great set of fixes and enhancements:

• 11 new fields
• 3 new widgets
• 25 enhancements on previous fields
• cross-browser enhancements (IE 6 is on the way…)
  I strongly suggest you take a look at the complete changeset, and our new list of examples.

Note: For those who were already using version 0.1.0, we wrote a description of the json API changes between 0.1.0 and 0.2.0.

Finally, I would like to thank:

• Maxime R. - for his bug fixing !
• Daniel Barreiro (alias Satyam) - for his help with YUI’s style
• mingfai - for his work on interactions and validations
• unomi - for his ideas, bug reports and forum help
• ClicRDV - for open-sourcing this library
• And many others - for bug reports
  Have fun !

On June 19th, WireIt was removed from distribution for copyright infringements. After discussions with the Yahoo! User Interface and Yahoo! Pipes teams, a project started to provide the wiring widgets as a YUI module. (Note: I don’t work for Yahoo! so it is NOT an official annoucment…)

I’m very happy with this decision and I can’t wait having this integrated into YUI. However, the quality concerns of YUI requires very detailed attention to cross-browser support and YUI integration. It will take some time before it appears on the YUI roadmap.

Meanwhile, I’ve been contacted by many WireIt users, who where anxious about using code with copyright infringements, and about seing no more bugfixes/new features. Therefore, I decided to release this new version that does not contain any coprighted code/assets anymore !

If you use WireIt <= 0.2.1, you MUST upgrade to 0.3.0.

WireIt get sponsored !

What’s new in version 0.3.0 ?

• Removed copyrighted images and code
• New drawing methods (straight lines and arrows, thanks to Marcin Iwa?ski)
• CanvasElement class (WireIt.Wire now inherits this class)
• Scissors class (for the scissors widget)
• LayerMap-beta (minimap to visualize/naviguate the layer)
• API Documentation much nicer and usable
• WireIt.Layer: “clear” and “setWiring” methods
• Bug fixes (including the much awaited positionning issue)
  I also started an interactive presentation, to demonstrate WireIt features.

Have fun !

If you don’t know Persevere yet, check out its impressive list of features (JSONPath/JSON-RPC/Comet support, etc…).

Here is a short tutorial to expose your MySQL tables through the persevere JSON REST interface.

1. Download persevere and unzip it.

2. Download the JDBC driver for MySQL and put the jar file into the “persevere/lib” folder.

3. Create a new file in “persevere/WEB-INF/config” named “myDatabase.json”

4. We will now configure the data source: (replace “myDatabase” and “myTable” by your database and table names.) ({ "id":"myDatabase.json", "sources": [ { "name":"myTable", "sourceClass":"org.persvr.datasource.DatabaseTableDataSource", "driver":"com.mysql.jdbc.Driver", "connection": "jdbc:mysql://localhost/myDatabase?user=myDbUser&pass=", "table":"myTable", "idColumn":"id", "dataColumns": [ "lastname", "firstname", ...and so on with your table columns ], "schema":{ "data":{"$ref":"../``myTable``/"} } } ] }Don’t forget to change your database user name and password !

5. run persevere (“java -jar start.jar”) and visit the following pages:

   • http://localhost:8080/myTable
   • http://localhost:8080/myTable/
   • http://localhost:8080/myTable/1

What to do next ?

• Add other tables: “sources” is an array !
• Use UTF8: Adds the following at the end of the connection string: &useUnicode=true&characterEncoding=utf-8&mysqlEncoding=utf8
• Add methods to the class or to its prototype (take a look at WEB-INF/config/examples.json)
• Write a script to auto-generate the config file from a database structure (and post it on the persevere forum)
• Read the Persevere Javascript Client Documentation and start coding applications !
  Have fun !