Developer Onboarding

Get started with Dzaleka Online Services development

Prerequisites

Required Tools

  • Node.js (v18 or later)
  • Git
  • VS Code (recommended) or your preferred IDE
  • GitHub account

Development Environment

  1. Install Node.js from nodejs.org
  2. Install Git from git-scm.com
  3. Install VS Code from code.visualstudio.com

Project Setup

Clone and Install

# Clone the repository
git clone https://github.com/dzaleka-online/dzaleka-online-services.git

# Navigate to project directory
cd dzaleka-online-services

# Install dependencies
npm install

# Start development server
npm run dev

Environment Configuration

Create a .env file in the root directory with the following variables:

# Site Configuration
SITE_URL=http://localhost:4321
SITE_NAME="Dzaleka Online Services"

# Content Management
CONTENT_DIR=src/content
PUBLIC_DIR=public

# Media Configuration
MEDIA_DIR=public/images
ALLOWED_IMAGE_TYPES=jpg,jpeg,png,gif,webp

# API Configuration (if needed)
PUBLIC_API_URL=your_api_url
PUBLIC_API_KEY=your_api_key

# Authentication (if needed)
AUTH_SECRET=your_auth_secret
AUTH_TRUST_HOST=true

Project Structure

Key Directories

  • src/pages/ - Main application pages and routes
  • src/components/ - Reusable UI components
  • src/layouts/ - Page layouts and templates
  • src/content/ - Content collections:
    • news/ - News articles and announcements
    • services/ - Organization and service listings
    • events/ - Community events and activities
    • resources/ - Educational and support resources
    • docs/ - Documentation and guides
    • stories/ - Community stories and experiences
    • photos/ - Photo gallery and visual content
    • jobs/ - Job listings and opportunities
    • profiles/ - Community member profiles
    • community-voices/ - Community perspectives
    • talents/ - Showcase of community talents
    • gallery/ - Visual content and media
  • src/utils/ - Utility functions and helpers
  • src/data/ - Data management and storage
  • src/lib/ - Shared libraries and configurations
  • src/scripts/ - Build and utility scripts
  • src/services/ - Service integrations and APIs
  • src/stores/ - State management stores
  • src/types/ - TypeScript type definitions
  • public/ - Static assets and images

Content Management

The project uses Astro's content collections for managing different types of content. Each collection has its own schema defined in src/content/config.ts:

  • News articles with categories like business-spotlight, announcement, success-story
  • Services with detailed organization information, contact details, and business hours
  • Events with registration and contact information
  • Resources with download links and file information
  • Photos with photographer credits and location data
  • Jobs with detailed requirements and application information
  • Community voices and stories

Important Files

  • astro.config.mjs - Astro configuration
  • tailwind.config.cjs - Tailwind CSS configuration
  • tsconfig.json - TypeScript configuration
  • package.json - Project dependencies and scripts

Development Workflow

Git Workflow

  1. Create a new branch for your feature:
    git checkout -b feature/your-feature-name
  2. Make your changes and commit them:
    git add .
    git commit -m "feat: your feature description"
  3. Push your branch and create a pull request:
    git push origin feature/your-feature-name

Commit Message Format

Follow the conventional commits format:

  • feat: for new features
  • fix: for bug fixes
  • docs: for documentation changes
  • style: for formatting changes
  • refactor: for code refactoring

Testing

Running Tests

# Start development server
npm run dev

# Build for production
npm run build

# Preview production build
npm run preview

Writing Tests

  • Create test files with .test.ts extension
  • Place tests in the same directory as the code being tested
  • Use descriptive test names that explain the expected behavior
  • Follow Astro's testing best practices

Deployment

Build Process

# Build for production
npm run build

# Preview production build
npm run preview

Deployment Steps

  1. Ensure all tests pass
  2. Build the project
  3. Deploy to staging environment
  4. Run final tests on staging
  5. Deploy to production

Code of Conduct

As a contributor to Dzaleka Online Services, you are expected to uphold our community values:

  • Respect the cultural diversity and heritage of the Dzaleka community
  • Maintain confidentiality of sensitive information and personal data
  • Ensure content accuracy and cultural sensitivity in all contributions
  • Support community empowerment through your work
  • Follow ethical guidelines for content creation and sharing
  • Respect intellectual property rights and proper attribution
  • Maintain professional communication in all interactions
  • Contribute to a safe and inclusive environment for all community members

By participating in this project, you agree to uphold these values and contribute positively to the Dzaleka community.

0 views