I had the great opportunity to participate in the virtual hackathon organized by the Senegalese tech community on Twitter. The challenge? Implement Conway's Game of Life with a unique twist. I'm proud to have finished 2nd place with my Progressive Web App (PWA) version developed with Vue.js!
The Challenge
The #GalsenCodingChallenge brought together talented junior developers from across Senegal. Our task was to create an innovative version of John Conway's cellular automaton.
Understanding Conway's Game of Life
For those unfamiliar, Conway's Game of Life is a zero-player game that evolves based on its initial state. The rules are simple:
- Underpopulation: Any live cell with fewer than 2 live neighbors dies
- Survival: Any live cell with 2 or 3 live neighbors lives on
- Overpopulation: Any live cell with more than 3 live neighbors dies
- Reproduction: Any dead cell with exactly 3 live neighbors becomes alive
My Approach and Implementation
Architecture Decisions
I chose Vue.js for its reactivity system, which was perfect for managing the game state and mostly the easy deployment. (Actually I really like Vue 😅)
Features
I knew from the beginning that most of the contenders would be able to pull off the implementation. That's why i decided to be different. I added background music (Wich i took from Tomodachi Life and slowed), some sound effects to signal a cell's birth or death, the possibility to change the grid's size etc.
Chosen technologies
- Frontend: Vue.js 3 (Composition API)
- State Management: Pinia
- Styling: Tailwind CSS
- Deployment: Vercel
Participating in #GalsenCodingChallenge was an incredible experience that pushed me to deliver my best work under pressure.