https://github.com/iamvery/ratchet

Plain HTML Templates
https://github.com/iamvery/ratchet

elixir ratchet template template-engine views

Last synced: 1 day ago
JSON representation

Plain HTML Templates

• Host: GitHub
• URL: https://github.com/iamvery/ratchet
• Owner: iamvery
• License: mit
• Created: 2016-05-12T23:26:49.000Z (over 8 years ago)
• Default Branch: master
• Last Pushed: 2017-07-18T03:40:36.000Z (over 7 years ago)
• Last Synced: 2024-10-31T22:19:02.009Z (8 days ago)
• Topics: elixir, ratchet, template, template-engine, views
• Language: Elixir
• Homepage: https://hexdocs.pm/ratchet
• Size: 85.9 KB
• Stars: 27
• Watchers: 2
• Forks: 3
• Open Issues: 9
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md
  • License: LICENSE.md

Awesome Lists containing this project

README

        
# Ratchet

[![Build Status][travis-img]][travis] [![Hex Version][hex-img]][hex]

[travis-img]: https://travis-ci.org/iamvery/ratchet.svg?branch=master

[travis]: https://travis-ci.org/iamvery/ratchet

[hex-img]: https://img.shields.io/hexpm/v/ratchet.svg

[hex]: https://hex.pm/packages/ratchet

Ratchet is a friendly little transformer that's here to fix your views.

For use with [Phoenix][phoenix], check out [PhoenixRatchet][phoenix-ratchet].

For more information, see the [Documentation][docs].

Given a plain HTML view template like this:

```html

  

    


    


    

    


      


    

  


```

It can be transformed into your final view by applying data:

```elixir

data = %{

  post: [

    %{title: "Ratchet is here!", body: "Hope you like it", permalink: {"Iamvery", href: "https://iamvery.com"}, comments: ["Not bad"]},

    %{title: "Robots", body: "What's the deal with them?", permalink: {"Google", href: "https://google.com"}, comments: ["Yea!", "Nah"]},

  ]

}

```

```html

  

    
Ratchet is here!

    
Hope you like it

    Iamvery

    


      
Not bad

    

  

  

    
Robots

    
What's the deal with them?

    Google

    


      
Yea!

      
Nah

    

  


```

## Installation

1. Install with Hex:

   ```elixir

   def deps do

     [{:ratchet, "~> 0.4"}]

   end

   ```

## Background

Ratchet is inspired by [Pakyow's][pakyow] [view transformation protocol][vtp].

One of the benefits of this style of view templates is designers don't have to learn whatever the latest templating language.

Instead views are plain HTML and CSS.

Once you get an HTML prototype from design, you can sprinkle in the appropriate properties for data binding.

## Release

1. Bump the version in `mix.exs`.

1. Add version to CHANGELOG.

1. Commit version with Git tag `vX.X.X`.

1. Draft GitHub release.

1. Publish to Hex.

   ```

   $ mix do hex.publish, hex.publish docs

   ```

[phoenix]: http://www.phoenixframework.org/

[phoenix-ratchet]: https://github.com/iamvery/phoenix_ratchet

[pakyow]: https://pakyow.org

[docs]: https://hexdocs.pm/ratchet

[vtp]: https://pakyow.org/docs/concepts/view-transformation-protocol