Skip to main content

Developer Quick Start Guide

This guide will help you quickly get started with Oan Finance development. Follow these steps to set up your development environment and make your first integration.

Prerequisites​

Before you begin, ensure you have:

  • Node.js (v18 or later)
  • Docker Desktop
  • Git
  • Code editor (VS Code recommended)
  • Access to Oan Finance repositories

Development Environment Setup​

1. Clone Repositories​

# Clone main platform repository
git clone https://github.com/oanfinance/oan-platform.git

# Clone frontend repository
git clone https://github.com/oanfinance/oan-frontend.git

2. Environment Configuration​

Create environment files:

# Backend environment
cd oan-platform
cp .env.example .env

# Frontend environment
cd ../oan-frontend
cp .env.example .env

3. Start Development Services​

# Start backend services
cd oan-platform
docker-compose up -d

# Install dependencies and start frontend
cd ../oan-frontend
npm install
npm run dev

Quick Integration Example​

1. Authentication Setup​

// src/services/auth.ts
import { OanClient } from '@oan/client-sdk';

const client = new OanClient({
  apiKey: process.env.OAN_API_KEY,
  environment: 'development'
});

// Initialize authentication
await client.initialize();

2. Create Loan Application​

// src/services/loan.ts
interface LoanApplication {
  businessId: string;
  amount: number;
  term: number;
  purpose: string;
}

async function createLoanApplication(data: LoanApplication) {
  try {
    const response = await client.loan.createApplication({
      ...data,
      timestamp: new Date().toISOString()
    });

    return response.applicationId;
  } catch (error) {
    console.error('Error creating loan application:', error);
    throw error;
  }
}

3. Handle Webhooks​

// src/webhooks/handler.ts
import express from 'express';
import { validateWebhook } from '@oan/client-sdk';

const app = express();

app.post('/webhooks/loan-status', async (req, res) => {
  // Validate webhook signature
  if (!validateWebhook(req.headers['x-oan-signature'], req.body)) {
    return res.status(401).send('Invalid signature');
  }

  const { applicationId, status } = req.body;

  // Handle status update
  await updateApplicationStatus(applicationId, status);

  res.status(200).send('Processed');
});

Development Tools​

1. API Testing​

Use the Oan Postman collection for API testing:

# Import Postman Collection
curl -o oan-postman.json https://api.oanfinance.com/postman/collection.json

Example API test:

// src/__tests__/api.test.ts
describe('Loan API', () => {
  it('should create loan application', async () => {
    const application = {
      businessId: 'test-business',
      amount: 100000,
      term: 12,
      purpose: 'working_capital'
    };

    const response = await client.loan.createApplication(application);
    expect(response.status).toBe('pending_review');
  });
});

2. Local Development UI​

Access local development:

3. Debug Configuration​

VS Code debug configuration:

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Debug API",
      "program": "${workspaceFolder}/src/index.ts",
      "preLaunchTask": "npm: build",
      "outFiles": ["${workspaceFolder}/dist/**/*.js"]
    }
  ]
}

Common Development Tasks​

1. Create New API Endpoint​

// src/controllers/business.ts
import { Router } from 'express';
import { validateRequest } from '../middleware';

const router = Router();

router.post('/business/verify', validateRequest, async (req, res) => {
  try {
    const { crNumber, businessName } = req.body;
    const verification = await businessService.verify(crNumber, businessName);
    res.json(verification);
  } catch (error) {
    res.status(400).json({ error: error.message });
  }
});

2. Add New Component​

// src/components/LoanCalculator.tsx
import React, { useState } from 'react';
import { calculateLoan } from '../services/loan';

export const LoanCalculator: React.FC = () => {
  const [amount, setAmount] = useState(0);
  const [term, setTerm] = useState(12);

  const handleCalculate = async () => {
    const calculation = await calculateLoan(amount, term);
    // Update UI with calculation
  };

  return (
    <div className="loan-calculator">
      {/* Component JSX */}
    </div>
  );
};

Next Steps​

  1. Explore Documentation

  2. Join Developer Community

    • Slack: #oan-developers
    • GitHub Discussions
    • Monthly Tech Talks

  3. Get Support

    • Tech Support: tech@oanfinance.com
    • Developer Portal: developers.oanfinance.com
    • API Status: status.oanfinance.com

Common Issues & Solutions​

1. API Connection Issues​

// Check API health
const checkApiHealth = async () => {
  try {
    const response = await fetch('http://localhost:8080/health');
    return response.ok;
  } catch (error) {
    console.error('API health check failed:', error);
    return false;
  }
};

2. Database Connection​

// Verify database connection
import { getConnection } from 'typeorm';

const checkDatabase = async () => {
  try {
    const connection = getConnection();
    await connection.query('SELECT 1');
    return true;
  } catch (error) {
    console.error('Database connection failed:', error);
    return false;
  }
};

3. Environment Setup​

# Verify environment
npm run verify-env

# Reset local environment
npm run reset-env

Development Best Practices​

  1. Code Quality

    • Follow TypeScript guidelines
    • Use ESLint and Prettier
    • Write unit tests
    • Document code changes

  2. Security

    • Never commit secrets
    • Validate all inputs
    • Use proper authentication
    • Follow security guidelines

  3. Performance

    • Optimize database queries
    • Use caching appropriately
    • Monitor API response times
    • Profile code performance