anticore-quick-start

Create your own anticore based project to build your app/site in seconds!

Usage no npm install needed!

<script type="module">
  import anticoreQuickStart from 'https://cdn.skypack.dev/anticore-quick-start';
</script>

README

anticore-quick-start

Create your own anticore based project to build your app/site in seconds!

How to install it?

  • Be sure to have node.js installed on your machine or install it: node.js
  • Install this package into your localhost directory
    • On UNIX systems:
    project-dir=/var/www/html/project-name
    $ npm i -D @lcf.vs/anticore-quick-start --prefix $project-dir && cd $project-dir && npm run build
    
    • On Windows systems:
    set project-dir=C:\wamp\www\project-name
    npm i -D @lcf.vs/anticore-quick-start --prefix %project-dir% && cd %project-dir% && npm run build
    
  • Open your browser on your project index http://localhost/project-name
  • Enjoy!

Make your first middleware

Create a ./assets/js/dev/test.md.js

import { anticore } from 'anticore'
import { one } from 'anticore/dom/query/one'
import { replace } from 'anticore/dom/tree/replace'

// create a middleware to be applied on each element matching the `main.test` selector
anticore.on('main.test', function (element, next, loaded) {
  // replace the current main by the new one
  loaded && replace(element, one('main'))
  next() 
})

Register your middleware

Import your middleware into your ./assets/js/dev/index.js

import {anticore} from 'anticore'
import './test.md.js'

anticore.defaults().populate()

Build your app

Into your localhost directory, each time your JS code changes

$ npm run build

Create the content

Create a file into your project, for example ./fragments/test.html

<main class="test">This is the test content</main>

Link it into your page

<a href="./fragments/test.html">Load the test content</a>