Code Monkey home page Code Monkey logo

notepad's Introduction

Flex Note Chrome App

This repository contains the source code of a Chrome App that allows you to manage your notes. You can download the Chrome App from the Chrome Web Store.

Demo

It's hosted here.

Development

Overview of Folder Structure

app Contains the source code for the Website

  • css CSS files used by the site, but they are generated by the .less files in the less folder
  • less less files for generating CSS files
  • img Images
  • js JavaScripts files and template files
    • chart Code to generate charts
    • data Data used by the charts or views
    • extension Extensions for libraries in the lib folder
    • lib Libraries
    • views Views that render HTML or SVG charts
      • template HTML files for appending to the DOM

Grunt Configuration

All the grunt config and options are located in the tasks folder, and here is the list of grunt commands:

  • grunt - run the watch command that compile less file automatically whenever there is a change.
  • grunt lib - concatenate some of the non-require.js dependent libraries to all-lib.js and minifies it to all-lib-min.js.
  • grunt cssdev - compile less files to app.css.
  • grunt cssdist - compile less files and compress them to create app.css, then concatenate it with mocha.css.
  • grunt dev - compile less files, and concatenate JavaScripts files to create not-minified app-min.js.
  • grunt build - create the compressed package in dist folder.
  • grunt sdev - start a http server at localhost:9000 for app folder.
  • grunt sdist - start a http server at localhost:9001 for dist folder.

Build

To build the package, you have to have node.js installed, then in command line console, run the followings steps once:

  • go to portfolio-site folder
  • (if grunt-cli is not installed) run npm install -g grunt-cli
  • run npm install

Now, you can build your project with running grunt build. The output folder is app-built, you can change it in the Gruntfile.js under section requirejs.

Less Files Compilation

grunt build compiles all less files to app-min.css. In development, you can run grunt watch, and all less files will be compiled in 2 seconds after you change a less file. You can change the delay period debounceDelay in Gruntfile.js under section watch.

Run the Website locally

In your command line console, run the following steps:

  • go to test-anywhere folder
  • run grunt sdev to start a http sever at localhost:9000 for app folder
  • run grunt sdist to start a http sever at localhost:9001 for dist folder
  • go to your browser, and type in localhost:9000 or localhost:9001 to the address bar
  • you should see the site running in the browser

License

MIT

notepad's People

Contributors

yguan avatar

Stargazers

acidburn avatar

Watchers

James Cloos 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.