kismet.hasanaj/novarix-networks-homepage
Archived
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

tailwind v4 update

Browse Source
This commit is contained in:
Kismet Hasanaj
2026-05-02 19:48:50 +02:00
parent bad0d2a29a
commit ce8672e283
7 changed files with 734 additions and 322 deletions
Download Patch File Download Diff File Expand all files Collapse all files
README.md
+142 -84
View File
@@ -1,115 +1,173 @@
# Novarix Networks Website
Static marketing site for `Novarix Networks`, prepared for this deployment model:
Static Tailwind CSS website for `Novarix Networks`.
- `Gitea` as the source of truth for the code
- `Ubuntu 24.04` VM running `Nginx` as the private web server
- `Nginx Proxy Manager` exposing the site publicly and handling SSL
The site is designed for this workflow:
- edit locally
- push changes to your internal `Gitea` repo
- run one deploy command on the Ubuntu Nginx VM
- serve the site from `/var/www/novarixnet.com/public`
- expose it publicly through `Nginx Proxy Manager`
## Project Structure
- `public/` static files that should be deployed to the web root
- `public/assets/logo/` brand assets used by the site
- `public/assets/favicon/` favicon files
- `ops/nginx/novarixnet.com.conf.example` example Nginx server block
- `public/index.html` main website content
- `public/styles.css` generated CSS served by Nginx after `npm run build`
- `public/script.js` small navigation and reveal animation script
- `public/assets/` logo and favicon assets
- `src/styles.css` Tailwind source file
- `EDITING.md` simple guide for changing content
- `deploy.sh` server-side update script
- `ops/nginx/novarixnet.com.conf.example` example Nginx config
## Current Recommended Architecture
## Important Tailwind Note
1. Keep this project in your internal `Gitea` repo.
2. Use the `Ubuntu 24.04` VM as the dedicated private web server.
3. Install `nginx` on that VM.
4. Deploy the contents of `public/` to something like `/var/www/novarixnet.com`.
5. Use `Nginx Proxy Manager` to proxy the public domain to the VM's private IP and Nginx port.
6. Let `Nginx Proxy Manager` handle the public certificate and HTTPS redirect.
## Recommended Workflow
This is the cleanest way to handle changes:
1. Edit the site locally.
2. Commit and push to `Gitea`.
3. On the `Ubuntu 24.04` web VM, pull the latest repo changes.
4. Sync the contents of `public/` into `/var/www/novarixnet.com`.
5. Reload `nginx` if needed.
This keeps:
- your repo as the source of truth
- the web VM as a deployment target
- live web files separate from the Git working tree
## Important Deployment Note
Do not point `nginx` directly at the Git repository directory if you can avoid it.
Better approach:
- keep the repo in a path such as `/opt/novarix-website`
- serve the live site from `/var/www/novarixnet.com`
- copy or sync `public/` into `/var/www/novarixnet.com` during deployment
That gives you a cleaner separation between:
- source code
- deployment files
- web server content
## Example Web VM Layout
- Repo checkout: `/opt/novarix-website`
- Live site root: `/var/www/novarixnet.com`
- Nginx site config: `/etc/nginx/sites-available/novarixnet.com`
## Example Deployment Flow On The Web VM
Clone the repo once:
This project uses the current Tailwind CSS v4 CLI setup:
```bash
git clone <your-gitea-repo-url> /opt/novarix-website
npm install tailwindcss @tailwindcss/cli
```
Deploy updated files:
Tailwind builds `src/styles.css` into this generated file:
```bash
sudo mkdir -p /var/www/novarixnet.com
sudo rsync -av --delete /opt/novarix-website/public/ /var/www/novarixnet.com/
```text
public/styles.css
```
Reload Nginx:
Nginx serves the compiled `public/styles.css` file. It does not understand Tailwind directly, so the build step must run after the repo is pulled.
## Ubuntu 24.04 Nginx Server Setup
Install Nginx and Git:
```bash
sudo apt update
sudo apt install -y nginx git
sudo systemctl enable nginx
sudo systemctl start nginx
```
Install Node.js 20 or newer. NodeSource currently supports Ubuntu 24.04 with Node 22, which is a good choice for this server:
```bash
sudo apt install -y curl
curl -fsSL https://deb.nodesource.com/setup_22.x -o nodesource_setup.sh
sudo -E bash nodesource_setup.sh
sudo apt install -y nodejs
```
After installing, confirm:
```bash
node --version
npm --version
```
Create the web directory and make your normal sudo user the owner:
```bash
sudo mkdir -p /var/www
sudo chown -R $USER:$USER /var/www
```
Clone the Gitea repo:
```bash
git clone http://10.10.10.11:3000/kismet.hasanaj/novarix-networks-homepage.git /var/www/novarixnet.com
```
Install the website dependencies and build the CSS:
```bash
cd /var/www/novarixnet.com
npm install --no-package-lock
npm run build
```
Use the Nginx config in:
```text
ops/nginx/novarixnet.com.conf.example
```
The important Nginx root is:
```nginx
root /var/www/novarixnet.com/public;
```
Enable the site:
```bash
sudo ln -s /etc/nginx/sites-available/novarixnet.com /etc/nginx/sites-enabled/
sudo rm -f /etc/nginx/sites-enabled/default
sudo nginx -t
sudo systemctl reload nginx
```
## Nginx Proxy Manager Flow
## Updating The Live Website
- Public DNS record points to your public IP
- Router forwards `80` and `443` to the host running `Nginx Proxy Manager`
- `Nginx Proxy Manager` receives the public request
- `Nginx Proxy Manager` proxies traffic to the private `Ubuntu 24.04` web VM
- Private `nginx` serves the static files
After pushing changes to Gitea from your local machine, SSH into the Nginx VM and run:
## Canonical Domain Suggestion
```bash
cd /var/www/novarixnet.com
./deploy.sh
```
Your strongest current options are:
The deploy script does this:
- `novarixnet.com` for broad and international branding
- `novarix.co.uk` for a stronger UK-local trust signal
```bash
git pull origin main
npm install --no-package-lock
npm run build
sudo nginx -t
sudo systemctl reload nginx
```
Pick one as the canonical domain and redirect the others to it.
If the script is not executable yet, run this once:
## Notes For This Site
```bash
chmod +x /var/www/novarixnet.com/deploy.sh
```
- Replace the placeholder `contact@novarixnet.com` link in `public/index.html`
- Add real company contact details before launch
- Add legal pages such as privacy and terms
- Add deeper service pages once the ISP, MSP, and transit offers are finalized
- Add a contact form or CRM integration later if needed
## Editing The Site
## Included Nginx Example
For simple content changes, edit:
Use the example config here as a starting point:
```text
public/index.html
```
- `ops/nginx/novarixnet.com.conf.example`
For visual styling changes, edit:
Review the domain names, root path, and cache rules before using it in production.
```text
src/styles.css
```
The quick editing guide is:
```text
EDITING.md
```
## Nginx Proxy Manager
Create a proxy host:
- Domain: `novarixnet.com`
- Scheme: `http`
- Forward hostname/IP: private IP of the Ubuntu Nginx VM
- Forward port: `80`
- SSL: request certificate and force SSL
- Enable `Block Common Exploits`
## Canonical Domain
Recommended primary domain:
```text
novarixnet.com
```
Redirect the other Novarix domains to the primary domain once DNS and Nginx Proxy Manager are ready.