Buy Now
Menu
 
Preview Download

Quick Setup

After downloading the Qoduby template, you can start customizing or using it within 5 minutes.

You basically need 3 things to customize the template. These are Node.js, Yarn Package Manager and Gulp.js respectively. Let's start by installing these 3 tools first.

1 - Node.js Installation

Visit https://nodejs.org/en, download the most suitable version for your operating system and run the setup file. Installation is extremely simple, just follow the instructions.

You can follow the steps below to check if Node.js is already installed on your system.

  1. Open the Terminal.
  2. Type node -v and press Enter.
  3. If Node.js is installed, it will display the version number. If it's not installed, an error message will appear.
2 - Yarn Package Manager Installation

Yarn is a JavaScript package manager used primarily in Node.js projects. It simplifies the management of dependencies in your project and ensures secure, fast, and consistent package installations.

Follow the installation instructions by visiting https://yarnpkg.com/getting-started/install.

3 - Gulp.js Installation

Gulp.js is a JavaScript-based automation tool used to automate repetitive tasks in projects.

Open the terminal and enter the following command and press enter.

yarn global add gulp-cli

If you have completed the installation of the above 3 tools, now let's take a look at how to customize the template.

First, decide which demo you will work on. This example is described for demo1.

Open the gulpfile.js file in the qoduby/html/tools directory with your code editor. You will see a simple javascript object as below.

									
const settings = {
  demoName: 'demo1',
  cssOutputStyle: 'compressed'
}

Type the folder name of the demo you want to work with in the demoName variable.

Then open your terminal and navigate to the tools folder.

cd qoduby/html/tools

Type the following command to install the dependencies and press enter.

yarn install

Then you can compile the project and run it in the browser by running the following command.

gulp

After running this command, http://localhost:3000/ address will be opened automatically in your browser and the project will run.

2023© Qoduby