Hi there,
You know those daily meetings that almost everyone have nowadays mostly virtually due to Covid-19? It can be hard to start them, specially in large teams, because no one knows if its their turn to talk or not, maybe want to respect hierarchy or something else.
With that in mind (and a few other reasons) in the beginning of the pandemic I created just for fun and as dare from my co-workers a way to randomly sort the order in how everyone in each team would speak everyday.
As this was just for fun and in house project I created a few extra features such as:
- daily quotes to boost the day
- the shuffler user (the user who would shuffle the order in every day)
- number of rounds the shuffle would sort, completely random also.
- sound of deck cards shuffling
- confetti effect when shuffle had finished sorting (with an extra audio - 20th Century Fox Intro Flute - which is an inside joke in my team)
This project was well received in the team and others also inside the company that more than a year passed it is still used everyday.
But the project was basic, being built with Vue 2 without components (file extension was .js) nor ES6 modules
Today I show you the improved version of this project, it is built with:
- Vue 3
- SCSS
- Pug
- Vite
- JSON Server
It has a few new features/improvements:
- CRUD application with JSON Server (with ability to upload image/avatar stored in base64, fallback to UI avatars API if no image provided)
- Daily Random Background from Picsum API
- New quotes API and it's author with picture from Quoteable API
- Layout improvement - the shuffle sorting works in mobile
dippas
/
shuffler
Fun way to sort how people will start talking in meetings, with daily quotes to boost your day
Shuffler
Fun way to sort how people will start talking in meetings, with daily quotes to boost your day
Show your support
Give a
Status
Built With
Getting Started
Installation
npm i
Development
Run json-server and let it running
npm run db
Run project in another terminal at the same time
npm run dev
Build for Production
npm run build
Locally preview production build
npm run preview
Features
- Shuffle Randomly Users (with random rounds between 5 and 10)
- CRUD application with JSON Server (with ability to upload image/avatar stored in base64, fallback to UI avatars API if no image provided)
- Randomly select daily who will shuffle
- Daily Random Backgrounds from Picsum API
- Daily Random Quotes and it's author with picture from Quoteable API
- Sound of deck cards shuffling
- Confetti effect when shuffle finished sorting (with an extra…
Give a ⭐️ if in github you enjoyed this project or buy me a coffee!
Top comments (3)
Very useful tool. Thanks for sharing with us. :)
Great tool, a nice visual way to organise the meetings!
Thanks my friend ;)