Buildly CLI Documentation

1. Overview

Buildly is designed to eliminate development friction by automating the setup of clean, architecture-focused folder structures. It supports React (for components), Next.js (for pages/modules), and Express.js (for API endpoints), pre-populating essential files with starter code.

Key Features

• **Multi-Framework Support:** Specialized scaffolding for React, Next.js, and Express.js.
• **Standardized Architecture:** Automatically includes extended folders like `hooks`, `forms`, `constants`, and `interface` to enforce best practices.
• **Configurable Extensions:** Supports generation with `.js`, `.jsx`, `.ts`, and `.tsx` file extensions.
• **Boilerplate Content:** Files are pre-populated with ready-to-use, minimal code to ensure immediate usability.

2. Installation & Core Command

2.1 Installation

Install **Buildly** globally via npm to make the command available in any directory on your system:

Alternatively, you can run it directly using `npx` without a global installation:

2.2 The Generate Command (`g`)

The primary command is `g` (generate), which takes the module name (the folder name) and a framework flag.

Command Syntax

Available Options

3. Framework Guides and Boilerplate

import React from "react";

export default function Home() {
  return <div>Home component loaded</div>;
}
                    

import React, { useState } from "react";

export default function HomeForm({ onSubmit }) {
  const [values, setValues] = useState({});
  
  const handleChange = (e) =>
    setValues(prev => ({ ...prev, [e.target.name]: e.target.value }));
    
  const handleSubmit = (e) => {
    e.preventDefault();
    if(onSubmit) onSubmit(values);
    console.log(values);
  };
  
  return (
    <form onSubmit={handleSubmit}>
      <input name="example" onChange={handleChange} placeholder="Enter value" />
      <button type="submit">Submit</button>
    </form>
  );
}
                    

import { useState, useEffect } from "react";

export function useHome() {
  const [state, setState] = useState(null);
  
  useEffect(() => {
    setState("Hello from hook");
  }, []);
  
  return { state, setState };
}
                    

import React from "react";

export default function Dashboard() {
  return <div>Dashboard component loaded</div>;
}
                    

export const User = (req, res) => {
  res.json({ message: "User controller" });
};
                    

import { Router } from "express";
import * as controller from "../controller/User.controller.js";

const router = Router();

router.get("/", controller.User);

export default router;
                    

export const schema = {
  type: "object",
  properties: {}
};