Account Creation & Initial Setup

Welcome to Diggama! This comprehensive guide will walk you through setting up your first headless CMS project in just a few minutes. Diggama's AI-powered platform makes it easy to create, manage, and deliver content across all your digital channels.

Creating Your Free Account

Getting started with Diggama is completely free. Our generous free tier includes everything you need to build and deploy your first project:

• 1 Website/Project: Perfect for personal projects or testing
• 10 Content Models: Create diverse content types
• 2,000 Content Records: Plenty of content for most projects
• Unlimited API Calls: No restrictions on content delivery
• Built-in Analytics: Track performance from day one
• AI-Powered Features: Content optimization and automation

Step 1: Sign Up

1. Visit manage.diggama.com/register
2. Enter your email address and create a strong password
3. Verify your email address (check your inbox for our verification email)
4. Complete your profile with basic information

Pro Tip: Use your work email if you're evaluating Diggama for your organization. This helps us provide better support and relevant resources.

Step 2: Dashboard Overview

Once logged in, you'll see the Diggama dashboard with these key sections:

• Projects: Manage all your CMS projects
• Content Models: Define your content structure
• Content Entries: Create and edit your content
• Analytics: Monitor performance and user behavior
• API Keys: Manage authentication tokens
• Settings: Configure project preferences

First Project Setup

Let's create your first project. We'll build a simple blog to demonstrate Diggama's core features.

Creating Your Project

Step 1: New Project

1. Click "Create New Project" from the dashboard
2. Enter a project name (e.g., "My First Blog")
3. Choose your preferred region for optimal performance
4. Select a project template or start from scratch

Step 2: Project Configuration

Configure these essential settings for your project:

Setting	Recommended Value	Description
Project Name	My First Blog	Descriptive name for easy identification
Default Language	English (US)	Primary language for content
Time Zone	Your local timezone	For scheduling and analytics
Environment	Development	Start with development environment

Understanding Environments

Diggama supports multiple environments for professional development workflows:

• Development: For building and testing
• Staging: For client review and testing
• Production: For live, public content

Start with the development environment and promote content through the pipeline as your project matures.

Content Modeling

Content models define the structure of your content. Think of them as blueprints that determine what fields and data types your content will have.

Creating Your First Content Model

Let's create a "Blog Post" content model for our example project:

Step 1: Create Content Model

1. Navigate to "Content Models" in the sidebar
2. Click "Create New Model"
3. Enter "Blog Post" as the model name
4. The system automatically creates an API identifier: blog-post

Step 2: Add Fields

Add these essential fields to your Blog Post model:

Field Name	Field Type	Settings
Title	Short Text	Required, max 200 characters
Slug	Short Text	Required, unique, URL-friendly
Excerpt	Long Text	Optional, max 500 characters
Content	Rich Text	Required, full editor
Featured Image	Media	Optional, single file
Author	Short Text	Required
Published Date	Date & Time	Required, default to now
Tags	Tags	Multiple values allowed
Status	Choice	Draft, Published, Archived

Step 3: Configure Field Settings

For each field, configure these important settings:

• Field ID: Automatically generated, used in API calls
• Required: Whether the field must have a value
• Unique: Ensure no duplicate values (useful for slugs)
• Default Value: Pre-populate fields with default values
• Validation: Set rules for data format and length
• Help Text: Provide guidance for content creators

Advanced Content Modeling

Content References

Create relationships between content models:

• Author Model: Create a separate model for author information
• Category Model: Organize posts into categories
• Related Posts: Link related articles together

Localization

If you need multi-language support:

1. Enable localization in project settings
2. Add supported languages
3. Mark fields as localizable or shared
4. Create content in multiple languages

API Integration

Diggama provides powerful APIs to deliver your content to any frontend application. Let's explore how to integrate with your project.

API Authentication

Generate API Keys

1. Go to "API Keys" in your project settings
2. Click "Generate New Key"
3. Choose the appropriate permissions:
   • Read Only: For public websites (recommended for frontend)
   • Read/Write: For content management applications
   • Admin: For full project management (use carefully)
4. Copy and securely store your API key

Security Note: Never expose admin API keys in client-side code. Use read-only keys for frontend applications and keep admin keys secure on your server.

Making Your First API Call

RESTful API Example

Retrieve all blog posts:

// Fetch all blog posts
const response = await fetch('https://api.diggama.com/v1/projects/YOUR_PROJECT_ID/content/blog-post', {
      headers: {
        'Authorization': 'Bearer YOUR_API_KEY',
        'Content-Type': 'application/json'
      }
    });
    
    const { data } = await response.json();
    console.log(data); // Array of blog posts

GraphQL API Example

Diggama also supports GraphQL for more flexible queries:

// GraphQL query for blog posts
    const query = `
      query GetBlogPosts {
        blogPosts {
          id
          title
          slug
          excerpt
          content
          featuredImage {
            url
            alt
          }
          author
          publishedDate
          tags
        }
      }
    `;
    
    const response = await fetch('https://api.diggama.com/graphql', {
      method: 'POST',
      headers: {
        'Authorization': 'Bearer YOUR_API_KEY',
        'Content-Type': 'application/json'
      },
      body: JSON.stringify({ query })
    });
    
    const { data } = await response.json();

JavaScript SDK

For easier integration, use the official Diggama JavaScript SDK:

Installation

npm install @diggama/sdk

Basic Usage

import { DiggamaClient } from '@diggama/sdk';
    
    const client = new DiggamaClient({
      projectId: 'YOUR_PROJECT_ID',
      apiKey: 'YOUR_API_KEY'
    });
    
    // Get all blog posts
    const blogPosts = await client.getEntries('blog-post');
    
    // Get a specific blog post
    const post = await client.getEntry('blog-post', 'post-slug');
    
    // Search blog posts
    const searchResults = await client.searchEntries('blog-post', {
      query: 'headless cms',
      fields: ['title', 'content']
    });

Frontend Implementation

Now let's build a simple frontend to display your content. We'll create examples for popular frameworks.

React/Next.js Implementation

Install Dependencies

npm install @diggama/sdk

Create a Blog List Component

// components/BlogList.js
    import { useState, useEffect } from 'react';
    import { DiggamaClient } from '@diggama/sdk';
    
    const client = new DiggamaClient({
      projectId: process.env.NEXT_PUBLIC_DIGGAMA_PROJECT_ID,
      apiKey: process.env.NEXT_PUBLIC_DIGGAMA_API_KEY
    });
    
    export default function BlogList() {
      const [posts, setPosts] = useState([]);
      const [loading, setLoading] = useState(true);
    
      useEffect(() => {
        async function fetchPosts() {
          try {
            const blogPosts = await client.getEntries('blog-post', {
              filter: { status: 'published' },
              sort: '-publishedDate'
            });
            setPosts(blogPosts);
          } catch (error) {
            console.error('Error fetching posts:', error);
          } finally {
            setLoading(false);
          }
        }
    
        fetchPosts();
      }, []);
    
      if (loading) return 
Loading posts...
;
    
      return (
        

          
Latest Blog Posts
          {posts.map(post => (
            

              
{post.title}
              
{post.excerpt}
              Read more →
            
          ))}
        
      );
    }

Create a Blog Post Page

// pages/blog/[slug].js
    import { DiggamaClient } from '@diggama/sdk';
    
    const client = new DiggamaClient({
      projectId: process.env.DIGGAMA_PROJECT_ID,
      apiKey: process.env.DIGGAMA_API_KEY
    });
    
    export default function BlogPost({ post }) {
      return (
        

          
{post.title}
          {new Date(post.publishedDate).toLocaleDateString()}
          

        
      );
    }
    
    export async function getStaticPaths() {
      const posts = await client.getEntries('blog-post');
      const paths = posts.map(post => ({
        params: { slug: post.slug }
      }));
    
      return { paths, fallback: false };
    }
    
    export async function getStaticProps({ params }) {
      const post = await client.getEntry('blog-post', params.slug);
    
      return {
        props: { post },
        revalidate: 60 // Regenerate page every 60 seconds
      };
    }

Vue.js/Nuxt.js Implementation

Composition API Example

// components/BlogList.vue
    
    
    

Static Site Generation

For maximum performance, generate static sites from your Diggama content:

Gatsby Integration

// gatsby-node.js
    const { DiggamaClient } = require('@diggama/sdk');
    
    const client = new DiggamaClient({
      projectId: process.env.DIGGAMA_PROJECT_ID,
      apiKey: process.env.DIGGAMA_API_KEY
    });
    
    exports.createPages = async ({ actions }) => {
      const { createPage } = actions;
      const posts = await client.getEntries('blog-post');
    
      posts.forEach(post => {
        createPage({
          path: `/blog/${post.slug}`,
          component: require.resolve('./src/templates/blog-post.js'),
          context: { post }
        });
      });
    };

Deployment Guide

Deploy your Diggama-powered application to popular hosting platforms.

Vercel Deployment

Step 1: Environment Variables

Add these environment variables in your Vercel dashboard:

• DIGGAMA_PROJECT_ID - Your project ID
• DIGGAMA_API_KEY - Your read-only API key

Step 2: Deploy Configuration

// vercel.json
    {
      "env": {
        "DIGGAMA_PROJECT_ID": "@diggama_project_id",
        "DIGGAMA_API_KEY": "@diggama_api_key"
      },
      "build": {
        "env": {
          "DIGGAMA_PROJECT_ID": "@diggama_project_id",
          "DIGGAMA_API_KEY": "@diggama_api_key"
        }
      }
    }

Netlify Deployment

Build Settings

• Build Command: npm run build
• Publish Directory: dist or build
• Environment Variables: Add your Diggama credentials

Webhook Integration

Set up automatic rebuilds when content changes:

1. Go to your Netlify site settings
2. Create a build hook URL
3. Add the webhook URL to your Diggama project settings
4. Content changes will trigger automatic rebuilds

AWS Amplify Deployment

Amplify Configuration

# amplify.yml
    version: 1
    applications:
      - frontend:
          phases:
            preBuild:
              commands:
                - npm install
            build:
              commands:
                - npm run build
          artifacts:
            baseDirectory: build
            files:
              - '**/*'
          cache:
            paths:
              - node_modules/**/*
        env:
          variables:
            DIGGAMA_PROJECT_ID: YOUR_PROJECT_ID
          secrets:
            - DIGGAMA_API_KEY

Next Steps & Advanced Features

Congratulations! You now have a fully functional headless CMS powered by Diggama. Here are some next steps to enhance your project:

Content Management Enhancements

Workflow Management

• Content Approval: Set up approval workflows for content review
• Scheduled Publishing: Schedule content to go live at specific times
• Content Versioning: Track changes and revert to previous versions
• Multi-language Content: Add localization for global audiences

Team Collaboration

• User Roles: Invite team members with appropriate permissions
• Content Comments: Add internal notes and feedback
• Content Assignments: Assign content tasks to team members
• Activity Logs: Track all changes and activities

Performance Optimization

Caching Strategies

• CDN Integration: Use Diggama's built-in CDN for fast content delivery
• Browser Caching: Implement proper cache headers
• API Caching: Cache API responses for better performance
• Static Generation: Pre-build pages for maximum speed

SEO Optimization

• Meta Tags: Add SEO fields to your content models
• Structured Data: Implement schema markup
• Sitemap Generation: Automatically generate XML sitemaps
• OpenGraph Tags: Optimize for social media sharing

AI-Powered Features

Leverage Diggama's built-in AI capabilities:

Content Optimization

• SEO Suggestions: AI-powered SEO recommendations
• Content Analysis: Readability and engagement scoring
• Auto-tagging: Automatic tag suggestions based on content
• Content Insights: Performance analytics and optimization tips

Automation Features

• Smart Workflows: Automated content routing and approval
• Content Scheduling: AI-suggested optimal posting times
• Personalization: Dynamic content based on user behavior
• A/B Testing: Automated testing of content variations

Analytics and Insights

Monitor your content performance with Diggama's built-in analytics:

Content Analytics

• Page Views: Track content consumption
• Engagement Metrics: Time on page, bounce rates
• Content Performance: Most popular and least viewed content
• User Behavior: How users interact with your content

API Analytics

• API Usage: Monitor API call patterns
• Performance Metrics: Response times and error rates
• Traffic Patterns: Peak usage times and scaling needs
• Cost Optimization: Identify optimization opportunities

Integration Examples

E-commerce Integration

// Shopify integration example
    const products = await client.getEntries('product');
    const shopifyProducts = await syncWithShopify(products);
    
    // Update Diggama with Shopify inventory
    await client.updateEntry('product', productId, {
      inventory: shopifyProducts.inventory,
      price: shopifyProducts.price
    });

Email Marketing Integration

// Mailchimp newsletter automation
    const newPosts = await client.getEntries('blog-post', {
      filter: { publishedDate: { gte: lastWeek } }
    });
    
    // Send newsletter with new posts
    await mailchimp.campaigns.create({
      settings: { title: 'Weekly Blog Roundup' },
      content: generateNewsletterContent(newPosts)
    });

Support and Resources

As you continue building with Diggama, these resources will help you succeed:

Documentation and Guides

• API Documentation: Comprehensive API reference
• SDK Documentation: Language-specific integration guides
• Best Practices: Proven patterns and approaches
• Use Case Examples: Real-world implementation examples

Community and Support

• Community Forum: Connect with other Diggama users
• Discord Chat: Real-time help and discussions
• GitHub Repository: SDKs, examples, and issue tracking
• Support Team: Direct access to our technical experts

Learning Resources

• Video Tutorials: Step-by-step implementation guides
• Webinars: Live sessions on advanced topics
• Blog Articles: Tips, tricks, and industry insights
• Case Studies: Success stories from real projects

Conclusion

You've successfully set up your first Diggama project and learned the fundamentals of headless CMS development. With AI-powered features, built-in analytics, and flexible APIs, Diggama provides everything you need to build modern, scalable content management solutions.

Whether you're building a simple blog, a complex e-commerce platform, or a multi-channel content strategy, Diggama's powerful features and developer-friendly tools will help you deliver exceptional digital experiences.

Start building today and discover how AI-powered content management can transform your development workflow and content strategy.