Files Panel

With files panel, you can create and manage multiple HTML, CSS, Javascript, Json files.
Files panel

In this tab you can see folder structure of your entire project. Under assets directory, you can see three folders by default

  1. css- where all the CSS files you create will be stored

  2. js - where all the JS files you create will be stored

  3. img - where all the images you upload will be stored

In the root directory all .html files and .json files will be stored.

When you can create any project following files are automatically created by default for you to get started.

  1. index.html

  2. styles.css

  3. app.js

Creating a New File

Creating New File

To create a file - Under Files Tab - bottom of the screen, you can see two options

  1. New File

  2. Gallery

Click the New File button. Give the file a name and file extension (.html, .css, .js, .json) If you want to upload images, you can click on the Gallery button.

Rename / Delete File:

Right Click menu - under Files panel

Right click on any file name, you will see the following options:

  1. Copy Relative Path - Copy the file path (you can use them code editor to link those files in your HTML)

  2. Rename File - Rename the file.

  3. Delete File - Delete the file.

With Gallery, you can upload your own images (.png, .jpg, .jpeg and .gif) or use high quality stock free images from Pexels

Uploading Images from Gallery

Using Pexels

  1. Open the gallery, click on the From tab

  2. Use any of the default suggestions or search on topic like Yoga, you can find relevant images to that topic and click on the image to insert into the canvas.