Set up a Chromebook for Quasar front-end development
How to install Node.js /NPM, Quasar / Vue.js and VS Code on Chrome OS
This is a short succinct guide, to set up a Chromebook for front-end development after a powerwash. It takes about 5 minutes.
Quasar is a powerful front-end framework for building PWA (progressive web app) applications with a Material Design look and feel, on top of the Vue.JS framework. Quasar is particularly powerful when it comes to deploying those apps as webapps, Electron apps, iOS and Android apps.
What this guide will set up
This guide focuses on what needs to be in place for Quasar front-end development. It will:
- Install Node.js and NPM for package management
- Install Quasar / Vue.JS
- Create a new quasar app and spin up the development server to check it work
- Install VSCode as the main code editor
Install Node.js and npm
- Open the Linux terminal on Chromebook
- Install Node.js. Note that more up to date versions will be available from the Nodesource package manager site (use the Debian versions)
curl -sL https://deb.nodesource.com/setup_13.x | sudo -E bash -sudo apt-get updatesudo apt-get install -y nodejs
- Check Node.js and NPM installation worked by typing
nodeandnpmfrom the command line.
Install Quasar and create new project
I will install using the Quasar CLI. If you wish to choose a different flavour of Quasar you can get more from the documentation here.
- Install Quasar CLI using
sudo npm install -g @quasar/cli - Create a new test project with
quasar create <project_name>. - Switch into the project directory and run the development server with
quasar dev. - Your app should be available on
http://localhost:8080. Note that in the past you would have had to usehttp://penguin.linux.test:8080rather than localhost.
VS Code setup
VS Code works nicely on the Chromebook.
To install, download the latest VS Code version for the Debian Linux and follow the simple installation.
That’s it. A fresh Quasar front-end development install in around 5 minutes.
