Building Nextcloud and Homepage Together on Ubuntu Server

Introduction

Want to run cloud storage and a personal website on a single server? Let's explore how to install Nextcloud and a website together on Ubuntu Server, step by step.

---

Part 0: Test Environment

This guide has been tested on the following hardware.

Hardware Specifications

• Model: 2019 Apple MacBook Pro

• CPU: Intel Core i5

• Storage: 512GB SSD

• OS: Ubuntu Server 24.04 LTS (or 22.04 LTS)

💡 Note: Installing Ubuntu Server on a MacBook Pro creates a quiet, power-efficient home server. However, some hardware like WiFi drivers may require additional configuration.

Minimum Requirements

Recommended specifications for running Nextcloud and a website together:

• CPU: Dual-core or higher

• RAM: Minimum 2GB (4GB or more recommended)

• Storage: Minimum 20GB (additional space depending on data volume)

• Network: Wired or wireless connection

---

Part 1: Basic Environment Setup

System Update

The first thing to do after server installation is updating the system.

sudo apt update
sudo apt upgrade -y

Install Essential Packages

Install the basic packages needed for web server operation.

sudo apt install -y apache2 mariadb-server php php-mysql \
  php-gd php-curl php-zip php-xml php-mbstring php-intl \
  php-imagick php-bcmath php-gmp unzip wget

Key Package Descriptions:

• apache2: Web server

• mariadb-server: Database

• php: PHP runtime and Nextcloud essential modules

---

Part 2: Database Configuration

MariaDB Security Setup

When you first install MariaDB, you need to configure security settings.

sudo mysql_secure_installation

Questions during setup:

• Set root password: Y (enter new password)

• Remove anonymous users: Y

• Disallow root login remotely: Y

• Remove test database: Y

• Reload privilege tables: Y

Create Database for Nextcloud

sudo mysql -u root -p

Run the following commands in the MariaDB prompt:

CREATE DATABASE nextcloud;
CREATE USER 'nextclouduser'@'localhost' IDENTIFIED BY 'your_password';
GRANT ALL PRIVILEGES ON nextcloud.* TO 'nextclouduser'@'localhost';
FLUSH PRIVILEGES;
EXIT;

💡 Tip: Replace your_password with a strong password!

---

Part 3: Nextcloud Installation

Download and Extract Nextcloud

cd /tmp
wget https://download.nextcloud.com/server/releases/latest.zip
sudo unzip latest.zip -d /var/www/html/

Set Permissions

Configure permissions so Apache can access Nextcloud files.

sudo chown -R www-data:www-data /var/www/html/nextcloud
sudo chmod -R 755 /var/www/html/nextcloud

Create Apache Configuration File

Create a virtual host configuration for Nextcloud.

sudo nano /etc/apache2/sites-available/nextcloud.conf

Enter the following content:

<VirtualHost *:80>
    ServerName your-domain.com
    DocumentRoot /var/www/html/nextcloud

    <Directory /var/www/html/nextcloud>
        Options +FollowSymlinks
        AllowOverride All
        Require all granted
    </Directory>

    ErrorLog ${APACHE_LOG_DIR}/nextcloud_error.log
    CustomLog ${APACHE_LOG_DIR}/nextcloud_access.log combined
</VirtualHost>

📝 Note: Replace your-domain.com with your actual domain.

Enable Apache Modules and Restart

sudo a2ensite nextcloud.conf
sudo a2enmod rewrite headers env dir mime
sudo systemctl restart apache2

---

Part 4: Complete Nextcloud Web Installation

Access http://your-domain.com in your browser to see the Nextcloud installation page.

Information to Enter:

1. Create administrator account name and password

2. Data folder: /var/www/html/nextcloud/data (use default)

3. Database information:

   • Database user: nextclouduser

   • Database password: Password set earlier

   • Database name: nextcloud

   • Database host: localhost

Click the installation complete button and Nextcloud will be running after a few minutes!

---

Part 5: Adding a Homepage

Let's add a main homepage separate from Nextcloud.

Configure Default Site

sudo nano /etc/apache2/sites-available/000-default.conf

Modify as follows:

<VirtualHost *:80>
    ServerName xxx.xxx.xxx.xxx
    DocumentRoot /var/www/html/homepage

    <Directory /var/www/html/homepage>
        Options Indexes FollowSymLinks
        AllowOverride All
        Require all granted
    </Directory>

    ErrorLog ${APACHE_LOG_DIR}/error.log
    CustomLog ${APACHE_LOG_DIR}/access.log combined
</VirtualHost>

Create Homepage Directory and HTML File

sudo mkdir -p /var/www/html/homepage
sudo nano /var/www/html/homepage/index.html

Simple HTML example:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>My Homepage</title>
    <style>
        body {
            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
            margin: 0;
            padding: 0;
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            min-height: 100vh;
            display: flex;
            justify-content: center;
            align-items: center;
        }
        .container {
            background: white;
            padding: 3rem;
            border-radius: 15px;
            box-shadow: 0 10px 40px rgba(0,0,0,0.2);
            text-align: center;
            max-width: 600px;
        }
        h1 {
            color: #333;
            margin-bottom: 1rem;
        }
        p {
            color: #666;
            line-height: 1.6;
        }
        .links {
            margin-top: 2rem;
        }
        .links a {
            display: inline-block;
            margin: 0.5rem;
            padding: 0.75rem 1.5rem;
            background: #667eea;
            color: white;
            text-decoration: none;
            border-radius: 5px;
            transition: background 0.3s;
        }
        .links a:hover {
            background: #764ba2;
        }
    </style>
</head>
<body>
    <div class="container">
        <h1>🚀 Welcome to My Server!</h1>
        <p>This server runs on Ubuntu Server,<br>
           hosting both Nextcloud and a website.</p>
        <div class="links">
            <a href="/nextcloud">☁️ Access Nextcloud</a>
            <a href="#">📧 Contact Me</a>
        </div>
    </div>
</body>
</html>

Set Permissions and Restart Apache

sudo chown -R www-data:www-data /var/www/html/homepage
sudo chmod -R 755 /var/www/html/homepage
sudo systemctl restart apache2

---

Part 6: Access Test

You can now access the following:

• Main Homepage: http://server-ip-address

• Nextcloud: http://domain-address or http://server-ip-address/nextcloud

---

Additional Tips

Increase PHP Memory Limit

Adjust PHP settings for large file uploads.

sudo nano /etc/php/8.1/apache2/php.ini

Find and modify the following items:

memory_limit = 512M
upload_max_filesize = 500M
post_max_size = 500M
max_execution_time = 300

⚠️ Caution: PHP version may vary by system. Check with php -v.

Firewall Configuration

sudo ufw allow 80/tcp
sudo ufw allow 443/tcp
sudo ufw enable

Install SSL Certificate (Let's Encrypt)

Enhance security with a free SSL certificate.

sudo apt install certbot python3-certbot-apache
sudo certbot --apache -d your-domain.com

---

Conclusion

Congratulations! 🎉 You can now operate Nextcloud and a personal homepage simultaneously on a single Ubuntu Server.

Advantages of This Setup:

• 💰 Cost savings (two services on one server)

• 🔒 Data ownership secured

• 🛠️ High customization freedom

• 📚 System management learning opportunity

Don't forget regular backups and updates!

---

Related Articles:

• Nextcloud Optimization Guide

• Apache Performance Tuning

• Server Security Checklist