Nucleify

Build modern, scalable web applications with Nucleify – a modular, core-driven framework of uniquely functional, nucleus-inspired modules. Easily structure, manage, and reuse components to create responsive, maintainable, and flexible web apps. Nucleify leverages Laravel for the backend and Nuxt for the frontend, giving developers a powerful full-stack foundation.

Designed with Atomic Design, Mobile-First, Feature-Sliced and Test Driven Development principles in mind, Nucleify helps developers deliver powerful, efficient, and future-proof web projects.

Join our project and become part of building something incredible!

Live preview

⭐ Project setup with a single command

⭐ Unique Laravel/Nuxt modules & overrides functionality

⭐ Atomic Design components + CSS modules

⭐ Futuristic UI made with PrimeVue + Chart.js + GSAP + SCSS

✅ 94/96 Performance

Introduced many optimizations:

• SSR & Prerendering
• Nuxt building with Atomic Design gives nicely separated chunks, able to defer as you wish
• Preloading icons, font-display: swap + defer non-critical CSS + JS
• Fetching website's content like questions, or technologies from database on prerender, making them editable and accessible instantly without load time
• nuxt-vitalizer - this module is just perfect
• @nuxtjs/google-fonts - downloading fonts on building & serving them on prerender, reducing third-party sources
• I also recommend <deferred-content> tag from PrimeVue - it impacts performance extremely well
• and some other magic tricks that we keep secret :D

PageSpeed Test

---

We have officially deprecated all installation methods other than Docker. \ Alternative installation approaches proved unnecessary and introduced additional complexity and avoidable setup issues. \ To ensure a simpler and more reliable setup process, the project is now distributed exclusively through Docker.

---

    Docker

🛠️ Installation

• First make sure u have installed latest version of Docker, Composer, Node.js, pnpm and have Make command ready

• Clone this repository

git clone https://github.com/Nucleify/Nucleify

• Run make command

That's it! Now, you can enter http://localhost:3000

Harder way

• Copy .config/.env.docker.example to .env in root directory

• Run composer install

• Build & run Docker image

sail up --build -d
sail art migrate:fresh --seed

Possible problems: - Sail: no such file or directory found: Solution 1, Solution 2 - Error: EACCES: permission denied, mkdir '/var/www/html/node_modules': sudo chmod 777 -R nucleify or Solution

🚀 Run

Root directory:

sail up -d

Possible problems: - Error starting userland proxy: listen tcp4 0.0.0.0:3306: bind: address already in use: sudo service mysql stop

❓ Usage

Migrations

sail art migrate:fresh --seed

# Reset database by dropping all tables and then run all migrations
# --seed flag runs the database seeders after the migrations

Factories

sail tinker

# if you wish, you can specify count in factory() or attributes in create()
Article::factory(100)->create();
Contact::factory(100)->create();
User::factory(100)->create();

# for Spatie Activity model
Database\Factories\ActivityFactory::new()->count(100)->create();

Tests

 Pest tests:

# run all tests
sail pest

# or specify group
sail pest --group=api

# defined tests groups:
api, activity-api, article-api, artisan-api, contact-api, sitemap-api, user-api,
database, feature, global, unit, commands, controllers, services, factories, migrations, models

# run all tests and check code coverage
sail pest --coverage

 Vitest tests:

sail pnpm run tests

pnpm

1. Install packages - sail pnpm install
2. Nuxt build - sail pnpm run build
3. Run Biome - sail pnpm run write
4. Run check - sail pnpm run check
5. Run Stylelint - sail pnpm run slint
6. Husky install - sail pnpm run prepare:husky

Sitemaps

Generate XML sitemap

sail art sitemap:generate

---

    Tech Stack

<a href="https://www.typescriptlang.org/" target="_blank"><img src="https://github.com/Nucleify/Nucleify/raw/v1.1/public/img/technologies/typescript.svg" height="35" width="35" alt="TypeScript" /></a>
<a href="https://www.php.net/" target="_blank"><img src="https://github.com/Nucleify/Nucleify/raw/v1.1/public/img/technologies/php.svg" height="35" width="35" alt="PHP" /></a>
<a href="https://laravel.com/" target="_blank"><img src="https://github.com/Nucleify/Nucleify/raw/v1.1/public/img/technologies/laravel.svg" height="35" width="35" alt="Laravel" /></a>
<a href="https://nuxt.com/" target="_blank"><img src="https://github.com/Nucleify/Nucleify/raw/v1.1/public/img/technologies/nuxt.svg" height="35" width="35" alt="Nuxt" /></a>
<a href="https://vuejs.org/" target="_blank"><img src="https://github.com/Nucleify/Nucleify/raw/v1.1/public/img/technologies/vue.svg" height="35" width="35" alt="Vue" /></a>
<a href="https://primevue.org/" target="_blank"><img src="https://github.com/Nucleify/Nucleify/raw/v1.1/public/img/technologies/primevue.svg" height="35" width="35" alt="PrimeVue" /></a>
<a href="https://www.chartjs.org/" target="_blank"><img src="https://github.com/Nucleify/Nucleify/raw/v1.1/public/img/technologies/chart-js.svg" height="35" width="35" alt="Chart.js" /></a>
<a href="https://greensock.com/gsap/" target="_blank"><img src="https://github.com/Nucleify/Nucleify/raw/v1.1/public/img/technologies/gsap.svg" height="35" width="35" alt="GSAP" /></a>
<a href="https://sass-lang.com/" target="_blank"><img src="https://github.com/Nucleify/Nucleify/raw/v1.1/public/img/technologies/scss.svg" height="35" width="35" alt="Sass" /></a>
<a href="https://html.com/" target="_blank"><img src="https://github.com/Nucleify/Nucleify/raw/v1.1/public/img/technologies/html5.svg" height="35" width="35" alt="HTML5" /></a>
<a href="https://www.docker.com/" target="_blank"><img src="https://github.com/Nucleify/Nucleify/raw/v1.1/public/img/technologies/docker.svg" height="35" width="35" alt="Docker" /></a>
<a href="https://www.heroku.com/" target="_blank"><img src="https://github.com/Nucleify/Nucleify/raw/v1.1/public/img/technologies/heroku.svg" height="35" width="35" alt="Heroku" /></a>
<a href="https://www.mysql.com/" target="_blank"><img src="https://github.com/Nucleify/Nucleify/raw/v1.1/public/img/technologies/mysql.svg" height="35" width="35" alt="MySQL" /></a>
<a href="https://pestphp.com/" target="_blank"><img src="https://github.com/Nucleify/Nucleify/raw/v1.1/public/img/technologies/pest.svg" height="34" width="34" alt="PestPHP" /></a>
<a href="https://vitest.dev/" target="_blank"><img src="https://github.com/Nucleify/Nucleify/raw/v1.1/public/img/technologies/vitest.svg" height="35" width="35" alt="Vitest" /></a>
<a href="https://biomejs.dev/" target="_blank"><img src="https://github.com/Nucleify/Nucleify/raw/v1.1/public/img/technologies/biome.svg" height="35" width="35" alt="Biome" /></a>
<a href="https://stylelint.io/" target="_blank"><img src="https://github.com/Nucleify/Nucleify/raw/v1.1/public/img/technologies/stylelint.svg" height="35" width="35" alt="Stylelint" /></a>
<a href="https://github.com/features/actions" target="_blank"><img src="https://github.com/Nucleify/Nucleify/raw/v1.1/public/img/technologies/github.svg" height="35" width="35" alt="Github Actions" /></a>
<a href="https://typicode.github.io/husky/" target="_blank"><img src="https://github.com/Nucleify/Nucleify/raw/v1.1/public/img/technologies/husky.svg" height="35" width="35" alt="Husky" /></a>

---

    Contribute

Before contributing, please take a moment to read our CONTRIBUTING.md.

Feel free to check Issues section.

Your skills and expertise will directly contribute to the success of our project, helping us achieve our goals and create an attractive product.

---

Contributors