Build and run the C++ Hello World component{:.external} included in the SDK samples repository. Components are the basic unit of executable software on Fuchsia.

The tasks include:

• Build and run the sample Hello World component.
• Make a change to the component.
• Repeat the build and run steps.
• Verify the change.

In VS Code, do the following:

1. Click the Explorer icon on the left side of VS Code.

   {: .screenshot width=“50”}

2. Open the getting-started.code-workspace file.

3. Verify that this file includes the following launch configuration:

   "launch": {
     "version": "0.2.0",
     "configurations": [
       {
         "name": "Fuchsia Hello World",
         "type": "zxdb",
         "request": "launch",
         "launchCommand": "tools/bazel run //src/hello_world:pkg.component",
         "process": "hello_world"
       }
     ]
   }
   

   This configuration is set to build and run the hello_world sample component.

4. Click the Run and Debug icon on the left side of VS Code.

   {: .screenshot width=“50”}

5. At the top of the Run and Debug panel, select the Fuchsia Hello World option in the dropdown memu.

   {: .screenshot width=“350”}

6. Click Run > Run Without Debugging.

   This starts a debug session (but without actually running a debugger) that launches the hello_world component. The bazel run command used to launch the component prints output similar to the following in the terminal:

   $ tools/bazel run //src/hello_world:pkg.component
   ...
   INFO: Build completed successfully, 155 total actions
   Running workflow: pkg.component_base
   Running task: pkg.debug_symbols_base (step 1/2)
   Running task: pkg.component.run_base (step 2/2)
   added repository bazel.pkg.component.runnable
   URL: fuchsia-pkg://bazel.pkg.component.runnable/hello_world#meta/hello_world.cm
   Moniker: /core/ffx-laboratory:hello_world.cm
   Creating component instance...
   Resolving component instance...
   Starting component instance...
   Started component instance!
   

7. In the terminal, check the status of the hello_world component:

   tools/ffx component show hello_world
   

   This command prints output similar to the following:

   $ tools/ffx component show hello_world
                  Moniker:  /core/ffx-laboratory:hello_world.cm
                      URL:  fuchsia-pkg://bazel.pkg.component.runnable/hello_world#meta/hello_world.cm
              Instance ID:  None
                     Type:  CML Component
          Component State:  Resolved
    Incoming Capabilities:  /svc/fuchsia.logger.LogSink
     Exposed Capabilities:
              Merkle root:  eebd529bd8ac6d2fd8a467279719f74c76643ebee2e94ebf594ffcbaac02fe8f
          Execution State:  Stopped
   

   The output shows that the hello_world component has run and is now terminated (Stopped).

8. In the debug toolbar at the top of VS Code, click the Stop icon to close the current debug session.

   {: .screenshot width=“250”}

   Note: You can safely ignore the Error: connection closed pop-up message at the bottom of VS Code for now.

9. Click the fuchsia-emulator icon at the bottom of VS Code.

   {: .screenshot}

   This opens the Command Palette at the top of VS Code.

10. Click Show log for fuchsia-emulator in the Command Palette.

    This opens the FUCHSIA LOGS panel and streams the device logs of your current Fuchsia target.

    {: .screenshot}

    Note: It may take a few minutes to load all the logs cached on the host machine. To stop the streaming of logs, click the pause icon at the top right corner of the FUCHSIA LOGS panel.

11. To fit the messages on the panel, click the Wrap logs icon at the top right corner of the FUCHSIA LOGS panel.

    {: .screenshot width=“200”}

12. In the Filter logs text box, type hello_world and press Enter.

    {: .screenshot}

    Notice that Hello, World! is printed from the hello_world component.

    Note: For more information on filtering syntax, see Filter Fuchsia logs.

13. Click the Explorer icon on the left side of VS Code.

14. Open the src/hello_world/hello_world.cc file.

15. Edit the message to "Hello again, World!".

    The main() method now should look like below:

    int main() {
      {{ '<strong>' }}std::cout << "Hello again, World!\n";{{ '</strong>' }}
      return 0;
    }
    

16. To save the file, press CTRL+S (or Command+S on macOS).

17. Click Run > Run Without Debugging.

    This builds and runs the hello_world component again.

18. Click the FUCHSIA LOGS tab on the VS Code panel.

19. Verify that Hello again, World! is printed in the logs.

    {: .screenshot}

20. In the debug toolbar at the top of VS Code, click the Stop icon.