Dans cette veille, on prend de la hauteur et on vous partage tous les mois les inspirations de notre équipe, les pistes de réflexions, les idées nouvelles, mais aussi nos trucs et astuces sur l’UX, l’UI et le développement web.
Site Internet
On apprécie beaucoup ce site web, sa construction, ses couleurs, ses interactions et cette façon de présenter son équipe qui est assez … Perturbante ;).
Inspiration
Une mise en forme du site et des articles très intéressants sur le thème du design.
Expérience web
Une expérience web bien sympathique pour les amateurs de musique électronique.
Outil
Un plugin Figma très pratique pour convertir n’importe quel site existant en fichier Figma éditable.
Ressource
StoryTribe est un outil pour réaliser des storyboard. Simple d’utilisation et riche d’une bibliothèque de centaines d’illustrations, à tester !
Identité visuelle
La Oficina de Parque, Ingrind Picanyol Studio
La Officina del Parque est un bar proposant des espaces de coworking pour les travailleurs nomades et les freelanceurs. Le studio Ingrid Picanyol a eu l’opportunité de réaliser son identité graphique et a parfaitement réussi à mêler le côté sérieux, moderne et décalé.
Ressource
Same Energy par Jacob Jackson
Un moteur de recherche visuel original, simple d’utilisation et performant. Pratique pour trouver des familles d’images sur des thèmes donnés.
Dev Tips du mois
ACID Transaction avec Mongoose
Une transaction ? C’est une séquence d’opérations et requêtes faites à la base de données. Utiliser les transactions basées sur le principe ACID permet de garantir la cohérence des opérations effectuées sur une base de données et d’assurer l’intégrité de celle-ci.
Pour « pas tout casser » Mongoose implémente justement ce principe de transaction : https://mongoosejs.com/docs/transactions.html
Atomicité : Toutes les opérations d’une transaction sont exécutées avec succès ou aucune d’entre elles ne l’est.
Cohérence : Chaque transaction porte la base de données d’un état cohérent à un autre état cohérent
Isolation : Les transactions s’exécutent de manière isolée les unes des autres pour éviter les conflits concurrents.
Durabilité : Les résultats d’une transaction confirmée sont persistants et disponibles même en cas de panne du système.
À titre d’exemple, voici endpoint utilisant une transaction, que l’on pourrait retrouver dans une API Fastify :
// Add a new book
app.post('/book', async (request, reply) => {
const session = await mongoose.startSession();
// Open transaction for the session
session.startTransaction();
try {
const { name, category } = request.body;
// specify "session" ensure the query belongs to the transaction
const [book] = await Book.create([{ name }], { session });
if (category) {
// We also pass "session" to make it belongs to the current transaction
const categoryDoc = await Category.findOneAndUpdate(
{ name: category },
{ $push: { books: book._id } },
{ new: true, session },
);
// by throwing exception we reach the catch block
// to abort operations which take place into the transaction
if (!categoryDoc) throw new NotFoundError('Category not found, can\'t create new book');
}
// If the code execution reaches this point
// because no exception were thrown, changes are saved
await session.commitTransaction();
reply.code(201).send(book);
} catch (error) {
// By trigger abortTransaction() the transaction ends
// without saving change made by the database queries
await session.abortTransaction();
reply.send(error);
} finally {
session.endSession();
}
});Langage du code : JavaScript (javascript)⚠️ Afin de pouvoir utiliser les transaction mongoose, mongod doit tournée sur un ensemble de replica set et non une instance autonome. Pour ce faire vous pouvez utiliser le package run-rs https://www.npmjs.com/package/run-rs.
