Code Monkey home page Code Monkey logo

laxar's Introduction

LaxarJS Build Status

Middleware for your web client: Create maintainable applications from small, isolated parts.

Why LaxarJS?

Find out why you would use LaxarJS and if it's the right tool for you. Then, explore the core concepts and browse the manuals in the documentation.

Have a look at the LaxarJS homepage for demos and more information.

Getting Started

The following is a very minimal getting started guide. It helps you to set up your first LaxarJS application and to create your first LaxarJS widget.

Get the Prerequisites

The node package manager npm is required to get started with LaxarJS. First we use it to obtain some basic development tools, namely Yeoman and grunt-cli, as well as the Yeoman generator for LaxarJS.

npm install -g grunt-cli yo
npm install -g generator-laxarjs

Note that, depending on your workstation setup, you might have to use sudo when running npm install with the -g option. Make sure that your PATH includes the global node_modules/bin directory. For additional information and troubleshooting, consult the documentation of npm and Yeoman respectively.

Create a LaxarJS Application from Our Template

The scaffolding tool yo can now be used to create artifacts from the LaxarJS templates. When asked if you would like to create example widgets, answer with Yes.

mkdir tryout
cd tryout
yo laxarjs
npm install
npm start

Visit your fresh application at http://localhost:8000/debug.html.

Press Ctrl-C to stop the server for now.

Create your own LaxarJS widget

Create a widget which simply displays Hello, world:

yo laxarjs:widget

Asked for the widget name, let's try my-first-widget.

Add some widget-HTML:

echo '<h1>Hello, world!</h1>' > includes/widgets/my-first-widget/default.theme/my-first-widget.html

Add the widget to the page application/pages/example1.json, so that it looks like this:

{
   "layout": "two-columns",
   "areas": {
      "left": [
         {
            "widget": "my-first-widget"
         }
      ],
      // ...
   }
}

Now you may start the development server again:

npm start

See your Hello, World! widget in action at http://localhost:8000/debug.html

Create a Compressed Release-Ready Version of Your Application

First, stop the development server using Ctrl-C.

grunt optimize
npm start

Now, your production-ready application can be visited at http://localhost:8000/index.html. You can also use grunt dist to get a zip archive containing the application without development server and build tools.

Next Steps

Have fun developing your first LaxarJS application.

Make sure to have a look at the manuals and and check out the demo applications on the LaxarJS website. If you're already developing your first widgets and want to know which programmatic APIs are provided by LaxarJS, have a look at the API docs.

laxar's People

Contributors

x1b avatar jpommerening avatar mkemmann avatar

Watchers

James Cloos avatar Jens Hoffmann 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.