A comprehensive certification preparation platform for Databricks certifications. This application provides a simulated exam environment with detailed performance analytics and review capabilities.
- User Authentication: Corporate email verification with OTP (One-Time Password) system
- Exam Taking: Interactive multiple-choice question interface with progress tracking
- Performance Analytics: Detailed results with:
- Overall score percentage
- Category-wise performance breakdown
- Visual charts and graphs
- Question-by-question review with explanations
- Session Persistence: Exam progress is saved locally and can be resumed
- Admin Panel: Domain whitelist management for access control
- Responsive Design: Mobile-friendly interface with adaptive navigation
- Frontend: React 19 with TypeScript
- Build Tool: Vite
- Styling: Tailwind CSS
- Charts: Recharts
- Routing: React Router DOM
- Deployment: GitHub Pages
- Node.js (v20 or higher recommended)
- npm or yarn package manager
-
Clone the repository:
git clone <repository-url> cd CertificationBootcamp
-
Install dependencies:
npm install
-
Set up environment variables: Create a
.envfile in the root directory:VITE_API_URL=http://localhost:3001/api
For production, the
VITE_API_URLshould point to your backend API endpoint.
-
Start the development server:
npm run dev
-
Open your browser and navigate to:
http://localhost:3000
-
Build the application:
npm run build
-
Preview the production build:
npm run preview
The built files will be in the dist directory.
The application is automatically deployed to GitHub Pages via GitHub Actions when changes are pushed to the main branch. The deployment workflow:
- Builds the application with the configured
VITE_API_URLfrom GitHub secrets - Uploads the build artifacts
- Deploys to GitHub Pages
Ensure that VITE_API_URL is set in your GitHub repository secrets for production deployments.
/- Home page with registration/login form/exam- Exam taking interface/results- Results and performance review/faq- Frequently asked questions/contact- Contact information/admin- Admin panel for domain management
App.tsx- Main application component with routing and state managementAdmin.tsx- Admin panel for managing email domain whitelistQuestionView.tsx- Individual question display componentResultsChart.tsx- Overall performance visualizationCategoryChart.tsx- Category-wise performance breakdowndbService.ts- API service layer for backend communication
The admin page (/admin) provides functionality to manage email domain whitelisting for the application.
- Only users with
@databricks.comemail addresses can access the admin panel - Two-factor authentication is required:
- OTP (One-Time Password) is sent to the Databricks email
- The OTP must be validated before accessing admin functions
-
Authentication Flow:
- Enter your
@databricks.comemail address - Click "Enviar Código de Verificação" (Send Verification Code)
- A 6-digit OTP code will be sent to your email
- Enter the OTP code and click "Validar Código" (Validate Code)
- Once validated, you'll see a confirmation message
- Enter your
-
Adding Domains: After successful authentication, you can add new email domains to the whitelist:
- Domain: Enter the domain name (e.g.,
example.com- without the@symbol) - Company Name: Enter the company name associated with the domain
- Click "Adicionar Domínio" (Add Domain) to submit
- Domain: Enter the domain name (e.g.,
-
Domain Validation:
- The system validates the domain format before submission
- Domains must follow standard domain name format rules
- Once added, users with emails from that domain can register and access the application
- Adding new corporate domains for partner companies
- Granting access to specific organizations
- Managing the list of allowed email domains for registration
- Email-based authentication restricted to Databricks employees
- OTP verification prevents unauthorized access
- Domain format validation ensures data integrity
- All admin actions are logged through the backend API
-
Registration:
- User enters first name, last name, corporate email, and selects an exam
- System validates email domain against whitelist
- OTP is sent to the email address
- User validates OTP to complete registration
-
Exam Taking:
- User selects an exam from available options
- Questions are displayed one at a time
- Progress is automatically saved to localStorage
- User can navigate between questions
- Exam can be completed at any time
-
Results:
- After completion, results are displayed with:
- Overall score percentage
- Correct/incorrect answer breakdown
- Category-wise performance
- Detailed review of each question with explanations
- Results are saved and can be viewed again later
- After completion, results are displayed with:
| Variable | Description | Required | Default |
|---|---|---|---|
VITE_API_URL |
Backend API base URL | Yes | http://localhost:3001/api |
CertificationBootcamp/
├── components/ # React components
│ ├── Admin.tsx # Admin panel
│ ├── Button.tsx # Reusable button component
│ ├── Card.tsx # Card container component
│ ├── CategoryChart.tsx # Category performance chart
│ ├── QuestionView.tsx # Question display component
│ └── ResultsChart.tsx # Overall results chart
├── services/ # Service layer
│ └── dbService.ts # API communication service
├── public/ # Static assets
├── App.tsx # Main application component
├── index.tsx # Application entry point
├── types.ts # TypeScript type definitions
└── vite.config.ts # Vite configuration
This project is proprietary and confidential.
For questions, feedback, or support, please contact the development team through the contact page in the application or via the email provided in the contact section.