Basic Workflow

Welcome to the fundamental workflow of YourAwesomeApp! This guide will walk you through the essential steps to get up and running quickly.

Step 1: Project Initialization

Create a New Project

To begin, you need to create a new project directory. Open your terminal or command prompt, navigate to your desired location, and run the following command:

yourawesomeapp new my-awesome-project

This command will create a new directory named my-awesome-project with the basic project structure.

Step 2: Understanding the Structure

Inside your project directory, you'll find several key files and folders:

src/: Contains your application's source code.
public/: Holds static assets like HTML, CSS, and images.
config/: Configuration files for your application.
package.json: Project metadata and dependencies.

Step 3: Running Your Application

Development Server

YourAwesomeApp comes with a built-in development server to help you during the development process. Navigate into your project directory and start the server:

cd my-awesome-project
yourawesomeapp start

This will compile your code and start a local server, usually at http://localhost:3000. You can now open your browser and see your application in action.

Step 4: Making Your First Change

Let's make a small modification to see how it works. Open the file src/index.js and find the line that renders the welcome message. Change it to something like:

// src/index.js
// ... other code
console.log("Hello, YourAwesomeApp World!");
// ... more code

Save the file. The development server should automatically detect the change and reload your application. Refresh your browser, and you should see your updated message.

Tip

The development server offers features like hot module replacement (HMR), which means many changes will reflect in the browser without a full page reload, speeding up your development even further.

Step 5: Building for Production

When you're ready to deploy your application, you'll need to build it for production. This process optimizes your code, bundles assets, and prepares everything for deployment.

yourawesomeapp build

This command will create an optimized build in the dist/ directory, ready to be served by any web server.

Congratulations! You've completed the basic workflow. You're now ready to explore more advanced features and start building your awesome application.