First web app
One key feature of ICP is its ability to serve web assets directly in a web browser. When an application is deployed to ICP, users from around the world can access it using only the smart contract's URL without requiring the developer set up a domain name or other web configuration.
Open your terminal and deploy a React app in minutes using these steps.
- Linux
- macOS
- Windows
Prerequisites
Download and install Node.js.1. Install the IC SDK.
sh -ci "$(curl -fsSL https://internetcomputer.org/install.sh)"
Confirm the IC SDK has been installed (you may need to open a new terminal window):
dfx --version
Prerequisites
Download and install Node.js. Using HomeBrew is recommended. Apple silicon machines: Download and install Rosetta:softwareupdate --install-rosetta1. Install the IC SDK.
sh -ci "$(curl -fsSL https://internetcomputer.org/install.sh)"
Confirm the IC SDK has been installed (you may need to open a new terminal window):
dfx --version
Prerequisites
dfx is not natively supported on Windows. You will need to install a Linux instance via Windows Subsystem for Linux and run all commands within that Linux instance.
wsl --install -d ubuntu Open the WSL Linux environment. Run all following commands within this environment. Download and install Node.js within your WSL Linux environment.1. Install the IC SDK.
sh -ci "$(curl -fsSL https://internetcomputer.org/install.sh)"
Confirm the IC SDK has been installed (you may need to open a new terminal window):
dfx --version
2. Download the React template.
Create a new empty directory, then download the project template:
mkdir react-project
cd react-project
npx degit jessiemongeon1/vite-react-motoko
This example project uses Motoko, React, and TypeScript template to create a simple counter application.
3. Setup the project using npm.
npm run setup
4. Deploy the project.
dfx deploy --playground
4. Interact with the app.
Open the frontend URL in a web browser. You'll see the template React frontend interface.
Congratulations, you just created your first internet-native React app!