Code Monkey home page Code Monkey logo

kickoff_tailwind's Introduction

Kickoff Tailwind

A free and simple starting point for Ruby on Rails 7 applications.. This particular template utilizes Tailwind CSS, a utility-first CSS framework for rapid UI development.

Included gems

Tailwind CSS by default

This template comes with Tailwind CSS preconfigured for use. To make use of tools like @apply and @layer a more sophisticated setup is required likely using PostCSS and JavaScript bundling.

How it works

When creating a new rails app simply pass the template filename and ruby extension through. Andy opted for esbuild instead of the default importmap configuration for JavaScript.

$ rails new sample_app -j esbuild -m template.rb

Once installed what do I get?

  • Tailwind CSS by default. You may opt for Bootstrap, Bulma, Sass, and PostCSS but this will require manual changes to the existing markup in the generated template view files.
  • Devise with a new name field already migrated in. The name field maps to the first_name and last_name fields in the database thanks to the name_of_person gem.
  • Enhanced views and devise views using Tailwind CSS.
  • The Stripe gem installed with the Stripe API to make accepting payments on the web. Be sure to add your own unique API keys.
  • Support for Friendly IDs thanks to the handy friendly_id gem. Note that you'll still need to do some work inside your models for this to work. This template installs the gem and runs the associated generator.
  • Optional Foreman support. Run .bin/dev to kick off rails and Tailwind processes. Foreman needs to be installed as a global gem on your system for this to work. i.e. gem install foreman
  • Custom view helper defaults for basic button and form elements.
  • Scaffolding templates made with Tailwind CSS

What do I not get?

  • This is not intended for production applications in it's current state. (This is entended to save you two days of boilerplate config work if you are already familiar with Devise and Tailwind.)

Changes on this fork

  • Devise version bumped to 4.9.8.
  • We have turned on fields in Devise for :confirmable (generated confirmation links can be accessed in development with the mailcatcher gem or by looking at the development server log)
  • The navbar has been updated to work with modern rails turbo
  • The beginnings of a separate User CRUD have been added (This would, like many other aspects of this fork, need to be locked down before ever going near a production environment).

Possible future extension

Boot it up

$ ./bin/dev

Credits

This adaptation by Greg Van de Mosselaer

Made by @justalever (yours truly). Find me on Twitter, web-crunch.com, GitHub.

kickoff_tailwind's People

Contributors

justalever avatar gregvan avatar arku 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.