NEWOIL 3

Project Overview

NEWOIL 3 is a rapid website building system similar to WordPress, designed to enable company clients to quickly have their own website in a short time.

I believe this system heavily relies on industry experience and is the most challenging and rewarding system I've developed.

Project Type: CMS Rapid Website System

Development Time: March 2023

Main Technologies: Laravel, Vue2, Docker

Clients Served: 60+ Enterprise Clients

Supported Languages: 22 Languages

Permission Management: 226 Granular Permissions

Core Design Philosophy

Below I'll use an example to illustrate the core design philosophy of this system.

Hypothetical Scenario

There are 5 clients: A, B, C, D, E

Requirements: Contact Us Form

Client A
- Name, Phone, Email
Client B
- Name, Message, Email, Fax
Client C
- Phone, How did you hear about us, Gender

Development Approach

Initially encountering such problems, the intuitive design is to union all fields and control them through switches. But as the number of clients increases, database fields and switches become more numerous.

Demonstration of different clients' form field requirements

Two Core Concepts

🔄

Batch Updates

When there are new features or bugs, update all websites (n clients) at once

Case: Email Sending

When needing to switch email service providers or modify email titles, as long as the code is consistent (same git repo), you can update nearly 57 websites in just 10 minutes (real case and number).

🧠

Abstract Thinking

Raising one layer of thinking dimension to consider design methods for various different requirements

Solution: Dynamic Forms

Using dynamic form creation instead of fixed field design, allowing the same git project to adapt to various different requirements.

Backend management interface providing intuitive content management features

Dynamic form settings allowing flexible configuration of various field combinations

Why Batch Updates Matter

Example 1: Sending Emails

Initially we used Service C, but suddenly one day Service C's account was locked, or the company needs to switch to Service E.

Or the email title was originally You have a new message needs to be changed to You have a new Contact Us message, requiring code changes.

In this company, almost all websites need to send emails. This is where batch updates come in handy. As long as the code is consistent (same git repo) you can update nearly 57 websites in just 10 minutes (real case and number).

Example 2: Article Publishing Time

One day Client D suddenly wanted articles to have publishing time functionality.

Another day Client E suddenly wanted articles to have custom sorting order.

But what if there are more and more clients? Each client having different logic and approaches wouldn't that create high maintenance costs?

So if I can give both Client D and Client E all three fields simultaneously, unifying requirements, wouldn't that greatly reduce maintenance costs?

Just unify to one logic, unify to one git project, and you can achieve easy maintenance.

Perhaps for Client D, the sorting requirement is unnecessary, and for Client E, the publishing time is also unnecessary. But being in an agency company, after weighing the options, I still adopted this approach.

Because in the real world, there aren't just 5 clients, but 60+ clients, and there will only be more clients in the future.

System Features

🌍

22 Languages

Backend switch settings supporting global multilingual websites

🔐

Role Permission System

Permissions granular to fields, 226 total fine-grained permissions

📁

Unlimited Levels

Multilingual categories, pages, product categories and products with unlimited levels

👥

Member System

Third-party login, approval mechanism, member levels, dynamic registration fields

📝

Form Management

Conditional sending, dynamic form settings, form groups

🎫

Marketing Management

Coupon system

🔍

SEO Automation

Automated JsonLD generation for each page, one-click publish/unpublish SEO

🎨

UI Customization

Theme switching, multilingual banners

System Demo

Technical Implementation

Project Responsibilities

In this system, I'm responsible for Server, Backend, and Admin Panel. Each project is frontend-backend separated.

Technical Foundation of Batch Updates

All client websites use the same git repository, with unified codebase making batch updates possible. When new features need to be added, bugs fixed, or dependencies updated, deployment to all client websites can be done in a short time.

Practice of Abstract Thinking

Through dynamic form creation, dynamic field registration and other techniques, the system can adapt to various different requirements. While this design approach increases initial development complexity, it significantly reduces long-term maintenance costs.

Technologies Used

Backend

Laravel Framework
Custom Composer Package
RESTful API Design

Server

Laradock (Docker Containerization)
Redis (Caching System)
MySQL (Database)

Admin Panel

Vue2
vue-router
vuex (State Management)
vue-i18n (Internationalization)
Ag-grid (Table Component)
Tinymce (Rich Text Editor)
Filebrowser (File Management)

Monitoring

Uptime-Kuma (Service Monitoring)

Project Highlights

Crystallization of Industry Experience

This system is the result of refinement through 60+ client requirements. Each feature's design considers actual application scenarios, not imagined but generalized from real requirements.

Maintainability First

Although initial development requires more abstract thinking, the unified codebase and batch update mechanism significantly reduce long-term maintenance costs. When there are new requirements, all client websites can be updated synchronously.

Balance Between Flexibility and Standardization

Meeting customization needs through dynamic configuration while maintaining code uniformity. This design philosophy allows the system to handle various different requirements while maintaining good maintainability.