Getting Started Qwikly

Qwik is a new kind of framework that is resumable (no JS and no hydration), built for the edge and familiar for React developers.

Prerequisites

Creating an app using the CLI

The first step is to create an application. Qwik comes with a CLI that allows you to create a basic working skeleton of an application. We will use the CLI to create a blank starter so that you can quickly familiarize yourself with it.

Run the Qwik CLI in your shell

npm create qwik@latest

The CLI will guide you through an interactive menu to set the project-name and select one of the starters:

After your new app is created, you will see an output like the following in your terminal:

💫 Let's create a Qwik app 💫

✔ Project name … qwik-app
✔ Select a starter › Basic

🦄  Success!  Project created in portfolio directory

🐰 Next steps:
   cd qwik-app
   npm install
   npm start

💬 Questions? Start the conversation at:
   https://qwik.builder.io/chat
   https://twitter.com/QwikDev

📺 Presentations, Podcasts and Videos:
   https://qwik.builder.io/media/

At this point, you will have qwik-app directory, that contains the starter app.

Running in development

Once the application is download.

  1. Change into the directory created by the npm create qwik@latest.
cd qwik-app
  1. Install NPM modules:
npm install
  1. Invoke the dev server
npm start
  1. You should see a server running with your To-do application

  VITE v3.1.1  ready in 140 ms

  ➜  Local:   http://localhost:5174/
  ➜  Network: use --host to expose

  1. Visit http://localhost:5174/ to explore the app.

Commands

Here are some useful commands to get you started. For a complete list please refer to package.json.

  • npm start: alias to npm run dev (this currently defaults to running SSR)
  • npm run preview: Production build and start preview server.
  • npm run build: builds the application for production.
  • npm run qwik add: Select an integration to add.
Made with ❤️ by