Notepad

Description

Application web de prise de note.

Ce projet prend place dans différents contextes : personnel, professionnel & scolaire. L’idée est de pouvoir accéder à des ressources diverses où que je sois.

Il s’agit donc de mettre en place une solution de bloc-notes. Ce dernier doit être accessible via navigateur (desktop & mobile).

A ses débuts très simple, mon application de notes a rapidement évolué afin de répondre à mes besoins. La plus grosse évolution étant l'ajout d'un 3ème type de notes (s'ajoutant aux 2 éxistants : simple text & code). Ce 3ème type intègre un éditeur de text WYSIWYG permettant la rédaction de document plus structuré et riches. Un système de partage de note est également venu se greffer à l'existant.

3 refontes graphiques ont été nécessaires avant de parvenir à un rendu satisfaisant. La dernière refonte intègre la librairie Material Design Lite qui vient moderniser l\'interface grâce à tout un lot d\'animations et de styles simples et efficaces.'

Le dévelopement de cette application a été un excellent exercice permettant d'améliorer grandement ma compréhension du Javascript à travers jQuery & l'Ajax lié au PHP.

J'envisage de redévelopper ce concept avec des technologies plus modernes telles que React et en mettant en place une API en PHP.

Note taking web app.

This project is useful in many context: whether it is for personal use, professional use or study-related use. The idea is to have access to all of my ressources, no matter where I am.

I wanted to create a notepad, available on any navigator (desktop & smartphone).

At the begining it was a very simple app but I quickly developed it so it could answer all of my needs. Adding a 3rd type of note (complementing the existing two: simple text & code) was the biggest step forward. This 3rd type adds a WYSIWYG text editor enabling me to have a more structured and a richer document. I also added a new note sharing system joining the already existing one.

I tested three graphic redesign before finding one I was satisfied with. The latest redesign includes a Material Design Lite library which adds a consequent number of animations and simple yet efficient styles to the interface.

The development of this app was an excellent exercise, allowing me to further develop my understanding of Javascript using jQuery & Ajax linked to PHP.

I consider developping again this concept with more modern technologies such as React and by adding a PHP API.

Détail

Client : Jean Tinland
Période : De aout 2017 à mars 2018

Technologies employées

HTML5
CSS3
Less
Material Design Lite
Javascript
jQuery
TinyMCE
Highlight.js
PHP
MySQL

Fonctionnalités

Application "One page"
Plusieurs types de notes
Editeur WYSIWYG
Catégories
Chat intégré
Formulaire de contact
Upload d'images
Partage de notes