Create Any App is a command line interface for rapid creation, configuration and development of JavaScript apps.
npx create-any-app <framework> my-appIf you've previously installed
create-any-appglobally vianpm install -g create-any-app, we recommend you uninstall the package usingnpm uninstall -g create-any-appto ensure thatnpxalways uses the latest version.
Check out the package README here.
All templates used can be found in the templates directory. The following conventions are followed:
- All templates for a particular framework are located at
templates/<framework> - Each framework template directory contains two main subdirectories -
defaultandtypescriptfor the JavaScript and TypeScript base versions respectively. - Directories starting with
--contain the files for the particular configuration corresponding to the name of the directory which are either added or overwritten during configuration. (For example--twwould contain files for TailwindCSS.) - The templates do not contain a
package.jsonfile as they are generated when the project is initialized.
To get a local copy up and running follow these simple steps.
In order to get a copy of the project you will require you to have Node.js (v14+) and the NPM package manager installed. If you don't have it, you can download the latest version of Node.js from the official website which also installs the NPM package manager by default.
Open the terminal in the folder in which you wish to clone the repository and enter the following command:
git clone https://github.com/1407arjun/create-any-app.git
cd create-any-appInstall all the NPM packages:
cd packages
npm iTo add the project to PATH run:
npm linkRun on the command line:
create-any-app --helpcreate-any-app
├── README.md
├── LICENSE
├── CONTRIBUTING.md
├── .eslintrc.json
├── .prettierrc
├── packages
│ ├── bin
│ │ └── caa.js //Entry point to the CLI
│ ├── data // Data about supported configurations
│ └── lib
│ ├── fs
│ │ ├── types // File system operations specific to each framework
│ │ ├── utils // Utility functions for file system operations
│ │ ├── download.js // Function to download template from GitHub archive
│ │ ├── npm.js // NPM packages corresponding to all configurations
│ │ └── main.js // Entry point to project setup
│ ├── inquirer
│ │ ├── features // Prompts for all configurations
│ │ ├── dir.js
│ │ └── features.js // Prompt for main menu
│ ├── cli.js // Entry point for any framework command
│ ├── create.js // Entry point for create command
│ ├── preset.js // Entry point for preset command
│ ├── settings.js // Returns the configurations recorded from all prompts
│ └── conf.js // Configure the conf package (for config files)
└── templates
└── framework
├── default
└── typescript
Contributions are what make the open source community such an amazing place to be learn, inspire, and create. Any contributions you make are greatly appreciated. Read CONTRIBUTING.md.
- Fork the Project. (Refer the local development instructions)
- Create your Feature Branch. (
git checkout -b feature/AmazingFeature) - Commit your Changes. (
git commit -m 'Add some AmazingFeature') - Push to the Branch. (
git push origin feature/AmazingFeature) - Open a Pull Request.
Following are some of the guidelines that have to be followed when creating/modifying a template:
- The base versions of the templates (
defaultortypescript) are generated from the default templates of the framework itself and have the same project structure except thetsconfig.jsonand other type decalaration files. - Modification or addition of configurations must be made in both, the
defaultandtypescripttemplates, so as to maintain the same structure and functionality across the base templates. - Create
--*directories where necessary. The files in this directory will replace the default template files with the same name in its parent directory. (For example, if the default template contains anindex.jsfile made using CSS and you want to add a TailwindCSS configuartion to it, then keep theindex.jsfile as it is and in the same directory create a--twdirectory and add anindex.jsfile to it which is made with TailwindCSS)
Following are some of the guidelines that have to be followed when adding/modifying a framework configuration:
- Add the base versions of the templates (
defaultortypescript) which are generated from the default templates of the framework itself and have the same project structure except thetsconfig.jsonand other type decalaration files. - Add your framework as a seperate command to
bin/caa.jsand give it a type name to be used throughout the package. - Append the same name from the step above to the
switchcase inmain.js. - Create a new file by the name of the framework from above inside
lib/fs/typesand add all the file operations required for various options to it. (Referlib/fs/types/next.jsas an example) - Use the functions provided under
lib/fs/utilto ease some of the file system operations. - Finally, follow the guidelines to modify the base templates to cater to all options.