Giter VIP home page Giter VIP logo

web-builder's Introduction

Olon - Html templating script

Getting Started

Olon is a gulp script that helps you build html sites recycling as much html mark up as possible or needed, populating it with dynamic data if needed, and deploy it to netlify.

Olon uses plain .html files, so you can start off with whatever you like, really a empty file or brand new template. Put everything in the 'dist' folder. This is the root of your website.

Data can be pulled from json file or from any api, '{{mustache}}' notation is used for rendering data within html files. The scope is the root of the json data obj.

Ghost api are installed by default. Posts will be available as a array within the main scope as {{posts}}, whereas pages as {{pages}}

We've also included a Gulp file to help you get started with theme customization. You'll need to install Node.js and Gulp before using our included gulpfile.js.

a scss folder is present for the purpouse of this demo. You will find all the branding colors inside scss/variables/_brand.scss. You can change them with a HEX value or with other predefined variables fromscss/variables/_colors.scss 5. Run in terminal gulp compile:scss for a single compilation or gulp for continous compilation of the changes that you make in *.scss files. This command should be run in the same folder where gulpfile.js and package.json are located

  1. Download the project's zip
  2. Make sure you have node.js (https://nodejs.org/en/) installed
  3. Type npm install in terminal/console in the source folder where package.json is located
  4. Run in terminal npm start for first compile and Index Page (default) of the product.

web-builder's People

Contributors

inative avatar ionicabizau avatar

Watchers

 avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.