Initialize the Project

You can now begin working on your Catalyst project from the CLI. The first step is to initialize the project in an empty directory. This will be the home directory of your project, and all of the project files will be saved in it.

You can learn more about this from the Project Directory Structure help page. You can learn about initializing a project in detail from the CLI help documentation.

For this application, we will only be initializing the project. We will not be initializing any function or client components.

  1. Create a folder for the project on your local machine and navigate to it from the terminal.

  2. Initialize a project by executing the following command from that directory:

copy
$
catalyst init

Navigate using the arrow keys and select your preferred portal and click Enter. If you have no other organizations associated with the account, then the default will be selected automatically. catalyst_tutorials_photostore_cli_project_init

.
  1. The CLI will now ask you to associate a Catalyst project with the directory. Associate it with the project that we created earlier from the console. Select PhotoStoreApp from the list and click Enter. catalyst_tutorials_photostore_cli_proj_sel

  2. Press Enter without making any selection. catalyst_tutorials_photostore_cli_compont_sel
    The project will be initialized, and a catalyst.json file will be created. catalyst_tutorials_photostore_cli_init_cmpltd

  3. Initialize an AppSail service in your project directory by executing the following CLI command:

copy
$
catalyst appsail:add
Note: In this tutorial, we are using the add command to initialize the AppSail service to showcase alternative Catalyst CLI commands to initialize the AppSail service.
  1. Enter “photo-store-app” as the name of the AppSail service. catalyst_tutorials_photostore_cli_appsail_init

  2. Enter “.” as the build path and select the latest runtime of Node.js as the function stack for your AppSail service. catalyst_tutorials_photostore_cli_appsail_func_stack
    The AppSail service will be initialized for your project. catalyst_tutorials_photostore_cli_appsail_completed

  3. To initialize the client as a React web app, execute the following command:

copy
$
npx create-react-app photo-store-app

catalyst_tutorials_photostore_cli_react_app_start
The client will be initialized as a React web app. catalyst_tutorials_photostore_cli_react_app_completed
The client and backend of the application have been initialized and are ready to be configured according to our requirements.

  1. Run the following command in the PhotostoreApp/photo-store-app directory. catalyst_tutorials_photostore_stratus_npm_start_appsail_set_up
    This is to ensure the project is getting served in localhost without any errors. catalyst_tutorials_photostore_app_init_compiled_success
    Your current project directory should appear as follows: catalyst_tutorials_photostore_stratus_first_dir_struct_1

The AppSail service has been initialized for your application.

Last Updated 2025-10-30 12:36:10 +0530 IST