SAFA is a web interface for an eSports FIFA tournament service that was operating in Discord through a Discord bot. The goal was to expand the service to the web. The service hosts FIFA tournaments where users can register as players, create teams, and participate in tournaments. It is integrated with Discord for user authentication and provides features such as team creation and joining, player/team/league profiles with detailed stats and role-based views through public searching, and team management for managers.
Features
- User Authentication: Users can login with their Discord account to access the service.
- Team Creation and Joining: Users can create teams and join teams.
- Player/Team/League Profiles: Detailed profiles with stats and role-based views.
- Team Management: Managers can manage teams and players.
- Search: Public searching for players, teams, and leagues.
Implementation
- Authentication: Discord OAuth for user authentication using JWT and cookies.
- Backend: Three layered architecture (controller, service, DAO) with Express and Sequelize. Redis for caching and session management.
Challenges
- Rate Limiting: Discord API has strict rate-limits for some endpoints. I used fetching with cache fallback using Redis to handle this.
- Concurrent Refresh Requests: In session management, multiple requests to refresh the access-token was causing issues. I handled this by using Redis as a mutex lock manager.
Mistakes and Learnings
- Development environment flexibility: When testing features, at frontend I often needed to change my configurations like player ID, team ID, isManager, etc. which I initially hardcoded in the frontend code instead of conditionally using environment variables based on the environment (development/production). This made it difficult to test and debug.
- Backend software architecture: I initially started developing the backend with a monolithic architecture which made it difficult to extend and maintain. I later refactored it to a three-layered architecture which made it easier to manage and extend.
- Testing: I didn’t write tests for the frontend and backend. This made it difficult to refactor and add new features which taught me the importance of testing.
Tech Stack
- Frontend: React, Tailwind CSS
- Backend: Node.js, Express, Redis, Sequelize