Volunteer Dashboard

MyPickle is a not-for-profit company with a mission to make finding help easier online. Everyone at some point will encounter an issue they struggle with, and Google isn't always the best resource during a crisis. The MyPickle website features a charity search engine powered by a curated and vetted database of charities crowdsourced by volunteers.

I have been volunteering with MyPickle since 2019, helping with various technical challenges. This project focuses on developing a comprehensive volunteer management system that allows volunteers to submit charity listings while maintaining data integrity and security.

Project Requirements

MyPickle needed a lightweight website for volunteers to submit listings to their database with these essential features:

• Volunteer Submissions: Ability for volunteers to submit new charities for review and manage their submissions
• Quality Assurance: QA team members can review volunteer submissions and provide relevant feedback
• User Management: Admin capabilities to manage user accounts and export listings
• Dynamic Forms: Form fields can be easily changed without corrupting previous submissions

The Challenge

This project pushed me significantly outside my comfort zone, requiring development of a secure, scalable Flask application for up to 100 volunteers while learning best practices and implementing enterprise-level security measures.

Flask Development at Scale

I opted to develop this software in Python Flask, a language I had only used a few times for personal projects at the time. Developing a website for up to 100 volunteers was frankly out of my comfort zone, but I was the only volunteer with Python Flask experience needed for this project.

This required extensive research into best practices for medium-sized Flask projects and ensuring security throughout the development process.

Security Implementation

The website had to be secure for multiple reasons:

• Data Integrity: Protecting hundreds/thousands of crowdsourced charity listings intended as a product offering
• Volunteer Privacy: Safeguarding volunteer information (limited to name and email only)
• SSO Integration: Implementing Google Single Sign-On to minimize stored personal data

Authorization Flow System

The website required a comprehensive permissions system to ensure users could only access authorized resources. I created a custom session management system with role-based access control.

This flow verifies users have basic access rights to the system, followed by endpoint-specific permission verification based on user groups.

Form Versioning System

Arguably the most challenging aspect was developing a form versioning system. When volunteers submit charity listings, they complete forms with various fields. These forms needed to be easily changeable while preserving the usefulness of historical data.

The Problem: If a volunteer submitted a listing with a 'Telephone Number' field, and that field was later removed from the form, the stored telephone number would become meaningless without its field context.

The Solution: I created a versioning system with numbered directories (1, 2, ..., X) in the web app's Forms directory. Each directory contains:

• form.json: JSON representation of the form structure
• categories.json: Form categories and options

When admins update forms, they copy the latest directory, increment the number, and modify the copied form.json. This ensures:

• Historical submissions retain their original form context
• New submissions use the latest form version
• Data integrity is maintained across all form versions

Backend Architecture

• Python Flask: Web framework providing RESTful API endpoints
• Google OAuth 2.0: Single Sign-On integration for secure authentication
• Session Management: Custom session handling with role-based permissions
• Database Design: Optimized schema supporting form versioning and user management

Security Features

• OAuth Integration: Google SSO reduces stored personal data
• Role-Based Access: Granular permissions for volunteers, QA, and admins
• Session Security: Secure session management with timeout handling
• Data Validation: Comprehensive input validation and sanitization

Form Management System

• Version Control: Structured directory system for form versions
• Dynamic Rendering: Forms generated from JSON configuration
• Backward Compatibility: Historical submissions viewable with original form context
• Admin Interface: Easy form modification without technical knowledge

User Management

• Multi-Role Support: Volunteers, QA reviewers, and administrators
• Submission Tracking: Volunteers can manage their charity submissions
• Review Workflow: QA team feedback and approval system
• Export Functionality: Admin data export capabilities

Project Outcomes

• Scalable Solution: Successfully deployed system supporting up to 100 volunteers
• Data Security: Implemented enterprise-level security with Google SSO
• Process Efficiency: Streamlined charity submission and review workflow
• Future-Proof Design: Form versioning system enables ongoing evolution

Technical Achievements

• Flask Best Practices: Learned and implemented medium-scale Flask development patterns
• Security Implementation: Successfully integrated OAuth 2.0 and role-based access control
• Innovation: Developed novel form versioning system for dynamic content management
• User Experience: Created intuitive interfaces for multiple user roles

Community Impact

The volunteer dashboard has significantly improved MyPickle's ability to crowdsource and curate charity information. The streamlined submission process enables volunteers to contribute more effectively, while the QA system ensures data quality. The platform supports MyPickle's mission to make finding help easier for people in crisis situations.

Learning Outcomes

This project provided extensive experience in:

• Flask Development: Advanced Python web framework implementation
• Authentication Systems: OAuth 2.0 integration and session management
• Security Best Practices: Enterprise-level security implementation
• Database Design: Schema optimization for complex data relationships
• User Experience Design: Multi-role interface development
• Volunteer Management: Non-profit technology solutions