Hosted on Tailwind component
This app is not meant to replace or harm TailwindUI in any way possible. This app is meant to be used for learning purposes only.
The data structure of this app is explained below:
- Main wrapper Ex: Page sections (which is listed as ComponentCollection in the db)
- Child wrapper of the templates Ex: Hero sections (which is listed as Category in the db)
- Components within 'Hero sections' (which is listed as Component in the db)
- Clone this app and run
bundle install
. rails db:create db:migrate db:seed
to get the app rolling to its default state.rails s
../bin/webpack-dev-server
to start the webpack server.- Go to
localhost:3000
.
There is no Admin section in this app.
To create the Main wrapper
, type rails c
in your terminal and type ComponentCollection.create! title: 'Headings'
. This will create a Main wrapper
which will be responsible for storing all the categories related to the tag Headings
.
Next create the category for Headings
. Exit out of the rails c
if you haven't.
rails g category headings page_headings
.
- This is a custom rails generator and it will create a
page_headings
category inside theheadings
table. Please follow therails
naming convention. The generator will take care of thecategory
name while storing in thedb
. - It will also create an empty folder within the
app/components/
folder or theapp/pages
folder. The location depends on theMain wrapper
which in this case isheadings
and which was created byComponentCollection.create! title: 'Headings'
.
Next create the template for page_headings
category.
rails g template page_headings with_meta_and_actions --type=component
.
- This is a custom rails generator and it will create a
with_meta_and_actions
template within thepage_headings
category. Again follow the rails naming convention. - This will create a
erb
file within thepage_headings
folder with the namewith_meta_and_actions.html.erb
. - The
type
args is necessary here. I am thinking of expanding the app by not just making smaller components, but also by making full page templates.
You can visit TailwindUI to get a brief idea about the structure of the files that you created.
Look at the components.yml
file in the db/components.yml
. Using the above generators will ensure proper storage in the yml
file. But, why the yml
file? Because the erb
templates are not stored in the db
. Seeding data in production
mode will be extremely time consuming and hectic. Hence with the help of the yml
file, we can just run heroku run rake db:seed
and the seeds.rb
will take care of the rest.
If you face any errors, please open an issue
. Mostly the errors happen because of name conflict while using generators.