DEV Community

JosephTJK
JosephTJK

Posted on • Updated on

Installing Open WC on PC

Open Web Components is very accessible for anyone interested in trying various ideas for building web components.

Tools Needed

  • A laptop
  • Node JS/ npm
  • VS Code IDE

Steps for getting started

Download and install the correct versions of node js (https://nodejs.org/en/) and visual studio code (https://code.visualstudio.com/download)
Follow the instructions on the links to download nodejs and vs code correctly. To check if the download was successful. Type node -v on the terminal to check the version.

Installing Yarn

Install yarn using the link [https://yarnpkg.com/] to your PC.
Open the link and type the following command in your terminal
npm install - global yarn

Incase you run into permission issues just add sudo infront of your previous command. sudo npm install -global yarn

Installing Open WC Boilerplate

  1. Create a local folder on your PC for your projects
  2. Open your terminal and Navigate to the folder
  3. Run npm init@open-wc
  4. Once the download begins you will be prompted with four questions
  5. Scaffold a New Project
  6. Select "Web Components to scaffold
  7. Toggle through each of the next options Linting, Testing, Demoing using the arrow key and select each
  8. Select No for Typescript
  9. Type lowercase "hello-world" for your tag name
  10. Click yes for disk
  11. Click yes with yarn for installing all the dependencies

You are all set now and Enjoy your web programming!!!

Top comments (0)