Notepad 2

Description

Refonte de mon application de prise de note.

Le concept de ce projet est donc le même que mon précédent Notepad finalisé en mars 2018. L'objectif était d'alléger le projet en le reprenant de zero.

La première étape d'allègement a été de passer en revue la totalité des fonctionnalités de la version précédente et de ne conserver que celles étant vitales.

Parmi les fonctionnalités retirées, on retrouve : le tchat, le formulaire de contact, le partage de notes, les différents types de notes, les mots clés ratachés à chaque notes, et tout un lot de fonctionnalités "gadgets".

Je me suis ensuite séparé d'un certain nombre librairies : adieu jQuery, Material Design Lite, TinyMCE.

J'ai profité de cette refonte complète pour revoir de A à Z le design du site et repartir sur la base d'un thème foncé (ce dernière présentant tout un tas d'avantages et avant tout doux pour les yeux).

J'ai également intégré QuillJS (un éditeur de texte WYSIWYG) remplacant (léger et sans dépendance vers jQuery) TinyMCE. J'ai aussi intégrer une petite librairie me permettant de gérer l'ordre de mes catégories et notes en glissant/déposant ces dernières.

Afin de finaliser ce projet, il ne me reste plus que la recherche de notes a développer.

Une fois terminé, j'ai toujours pour projet de le redévelopper à nouveau avec des technologies plus modernes telles que React ou bien avec des Custom Elements (que j'ai pu utliser lors de la création de la dernière version de mon portfolio).

I decided to rework my personal online notepad in November 2018 that I based on the previous one (made in March 2018).

The goal was to lighten the whole project so I started from scratch.

The first step to make it lighter was to scan all the functionalities of the old version and keep only the ‘vital ones’. I decided to remove the online chat, the contact form, note sharing, some types of notes and other “gadgets”.

I then abandoned some libraries such as jQuery, Material Design Lite and TinyMCE.

I decided to redo the design of the website from start to finish. I based on a darker theme (not just because it is better for the eyes but for many other reasons).

I also integrated QuillJS (lighter and independent from jQuery WYSIWYG text editor) replacing TinyMCE. I also added a small built-in library allowing the user to order his or her categories and notes with a simple slide and drop.

In order to finalise this project, I simply need to find notes to develop.

Once finished, I always have the ideo to re-develop it with modern technologies such as React or add Custom Elements (which I used for my latest portfolio).

Détail

Client : Jean Tinland
Période : Novembre 2018

Technologies employées

HTML5
CSS3
Sass
Javascript
QuillJs
Highlight.js
PHP
MySQL
Simplebar
Librairie drag'n drop

Fonctionnalités

Application "One page"
Plusieurs types de notes
Editeur WYSIWYG
Catégories