{"id":28302499,"url":"https://github.com/giljr/hotwire-powered-blog","last_synced_at":"2025-06-25T06:33:36.719Z","repository":{"id":281509505,"uuid":"945204827","full_name":"giljr/Hotwire-Powered-Blog","owner":"giljr","description":"Build a Real-Time Blog - Turbo Streams and Stimulus.","archived":false,"fork":false,"pushed_at":"2025-05-26T06:27:21.000Z","size":106,"stargazers_count":0,"open_issues_count":8,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-05-31T05:37:47.010Z","etag":null,"topics":["hotwire","hotwire-demo","hotwire-stimulus","hotwire-turbo","howto-tutorial","step-by-step-guide","timezone","turboframe","turbostreams","working-apps"],"latest_commit_sha":null,"homepage":"https://medium.com/jungletronics/from-zero-to-hotwire-rails-8-e6cd16216165","language":"Ruby","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/giljr.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2025-03-08T22:28:03.000Z","updated_at":"2025-03-12T21:55:45.000Z","dependencies_parsed_at":"2025-03-09T16:19:52.543Z","dependency_job_id":"844a41d0-59a3-4355-b703-7bd15c167a84","html_url":"https://github.com/giljr/Hotwire-Powered-Blog","commit_stats":null,"previous_names":["giljr/hotwire-powered-blog"],"tags_count":2,"template":false,"template_full_name":null,"purl":"pkg:github/giljr/Hotwire-Powered-Blog","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/giljr%2FHotwire-Powered-Blog","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/giljr%2FHotwire-Powered-Blog/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/giljr%2FHotwire-Powered-Blog/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/giljr%2FHotwire-Powered-Blog/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/giljr","download_url":"https://codeload.github.com/giljr/Hotwire-Powered-Blog/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/giljr%2FHotwire-Powered-Blog/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":259715073,"owners_count":22900566,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["hotwire","hotwire-demo","hotwire-stimulus","hotwire-turbo","howto-tutorial","step-by-step-guide","timezone","turboframe","turbostreams","working-apps"],"created_at":"2025-05-23T21:11:37.988Z","updated_at":"2025-06-25T06:33:36.711Z","avatar_url":"https://github.com/giljr.png","language":"Ruby","funding_links":[],"categories":[],"sub_categories":[],"readme":"## Hot Blog: A Real-Time Blog with Hotwire in Rails 8\n\nWelcome to Hot Blog, a demonstration application designed to explore and master Hotwire technologies in Rails 8. This app showcases real-time updates, seamless navigation, and dynamic interactions powered by Turbo Streams and Stimulus. Whether you're new to Hotwire or looking to deepen your understanding, this is the perfect place to experiment and learn. Let's get started!\n\n..............................................................................\n### Table of Contents\n[Getting Started](#getting-started)\n\n[Setting Up the Project](#setting-up-the-project)\n\n[User Authentication](#user-authentication)\n\n[Post and Comment Functionality](#post-and-comment-functionality)\n\n[Real-Time Updates with Turbo Streams](#real-time-updates-with-turbo-streams)\n\n[Time Zone Configuration](#time-zone-configuration)\n\n[Current User Management](#current-user-management)\n\n[Routing](#routing)\n\n[Conclusion](#conclusion)\n\n..............................................................................\n\n\n### [Getting Started](#getting-started)\n\n\n#### Prerequisites\n\n        Ruby 3.x\n        Rails 8.x\n        SQLite3 (or your preferred database)\n\n#### Installation\n\nClone the repository:\n\n\n    git clone https://github.com/your-username/hot-blog.git\n    cd hot-blog\n\nInstall dependencies:\n\n    bundle install\n\nSet up the database:\n\n    rails db:setup\n\nStart the server:\n\n    rails server\n\nVisit http://localhost:3000 in your browser.\n\n### [Setting Up the Project](#setting-up-the-project)\n#### 1. Create the Rails Application\n\n    rails new blog\n\n#### 2. Create the About Page\n\n    mkdir app/views/about \u0026\u0026 rails generate controller about index\n\nUpdate ```app/views/about/index.html.erb```:\n```html\n\u003ch1\u003eHot Blog v1\u003c/h1\u003e\n\u003cp\u003eThe Hot Blog is a demonstration application designed to explore and master Hotwire technologies in Rails 8. This app showcases real-time updates, seamless navigation, and dynamic interactions powered by Turbo and Stimulus. Whether you're new to Hotwire or looking to deepen your understanding, this is the perfect place to experiment and learn. Welcome!\u003c/p\u003e\n```\n#### 3. Create the Main Page\n\n    mkdir app/views/main \u0026\u0026 rails generate controller main index\n\nUpdate ```app/views/main/index.html.erb```:\n```html\n\u003ch1\u003eWelcome to Hot Blog!\u003c/h1\u003e\n\u003cp\u003ePlease Sign Up first!\u003c/p\u003e\n```\n#### 4. Configure Routes\n\nUpdate config/routes.rb:\n\n    Rails.application.routes.draw do\n      get \"about\", to: \"about#index\"\n      root \"main#index\"\n    end\n\n\n### [User Authentication](#user-authentication)\n#### 1. Create the User Model\n\n\n    rails generate model User email:string password_digest:string\n    rails db:migrate\n\n#### 2. Add Password Security\n\nAdd ```has_secure_password``` to ```app/models/user.rb```:\n\n\n    class User \u003c ApplicationRecord\n        has_secure_password\n    end\n\nUncomment ```bcrypt``` in your **Gemfile**:\n\n\n    gem \"bcrypt\", \"~\u003e 3.1.7\"\n\nRun bundle install.\n#### 3. Add Validations\n\nUpdate ```app/models/user.rb```:\n\n    validates :email, presence: true, format: { with: URI::MailTo::EMAIL_REGEXP }\n    validates :password, presence: true, length: { minimum: 6 }, confirmation: true\n\n#### 4. Create a User\n\nIn the Rails console:\n\n    User.create(email: \"jay@gmail.com\", password: \"password\",     password_confirmation: \"password\")\n\n\n### Post and Comment Functionality\n#### 1. Generate Post Scaffold\n\n    rails generate scaffold post title body\n    rails db:migrate\n\n#### 2. Generate Comment Resource\nbash\n\n    rails generate resource comment post:references user:references content:text\n    rails db:migrate\n\n#### 3. Set Up Associations\n\nUpdate ```app/models/post.rb```:\n\n\n    class Post \u003c ApplicationRecord\n      has_many :comments, dependent: :destroy\n    end\n\nUpdate ```app/models/comment.rb```:\n\n    class Comment \u003c ApplicationRecord\n      belongs_to :post\n      belongs_to :user\n    end\n\n### [Real-Time Updates with Turbo Streams](#real-time-updates-with-turbo-streams)\n#### 1. Add Turbo Streams to Comments\n\nUpdate ```app/controllers/comments_controller.rb```:\n\n```ruby\nclass CommentsController \u003c ApplicationController\n  before_action :set_post\n\n  def create\n    @comment = @post.comments.build(comment_params)\n    @comment.user = Current.user\n\n    if @comment.save\n      respond_to do |format|\n        format.turbo_stream\n        format.html { redirect_to @post, notice: \"Comment created successfully!\" }\n      end\n    else\n      redirect_to @post, alert: \"Failed to create comment.\"\n    end\n  end\n\n  private\n\n  def set_post\n    @post = Post.find(params[:post_id])\n  end\n\n  def comment_params\n    params.require(:comment).permit(:content)\n  end\nend\n```\n\n#### 2. Create Turbo Stream Views\n\nCreate ```app/views/comments/create.turbo_stream.erb```:\n```erb\n\u003c%= turbo_stream.append \"comments\", @comment %\u003e\n```\n\n#### 3. Update Post Show View\n\nUpdate ```app/views/posts/show.html.erb```:\nerb\n```erb\n\u003c%= turbo_stream_from @post %\u003e\n\u003c%= render @post %\u003e\n\n\u003cstrong\u003eComments:\u003c/strong\u003e\n\u003cdiv id=\"comments\"\u003e\n  \u003c%= render @post.comments %\u003e\n\u003c/div\u003e\n\n\u003c%= render \"comments/new\", post: @post %\u003e\n```\n### [Time Zone Configuration](#time-zone-configuration)\n#### 1. Set Local Time Zone\n\nUpdate ```config/application.rb```:\n\n```erb\nconfig.time_zone = \"America/Porto_Velho\"\nconfig.active_record.default_timezone = :local\n```\n#### 2. Add Local-Time Library\n\nRun:\n```bin/importmap pin local-time```\n\nUpdate ```app/javascript/application.js```:\njavascript\n```js\nimport LocalTime from \"local-time\"\nLocalTime.start()\n```\n\n### [Current User Management](#current-user-management)\n#### 1. Create Current Class\n\nCreate ```app/models/current.rb```:\n\n```ruby\nclass Current \u003c ActiveSupport::CurrentAttributes\n  attribute :user\nend\n```\n\n#### 2. Set Current User in Controller\n\nUpdate ```app/controllers/application_controller.rb```:\n\n```ruby\nclass ApplicationController \u003c ActionController::Base\n  before_action :set_current_user\n\n  private\n\n  def set_current_user\n    Current.user = User.find_by(id: session[:user_id]) if session[:user_id]\n  end\nend\n```\n### [Routing](#routing)\n\nUpdate ```config/routes.rb```:\n```ruby\nRails.application.routes.draw do\n  resources :posts do\n    resources :comments\n  end\n\n  get \"about\", to: \"about#index\"\n  get \"sign_up\", to: \"registrations#new\"\n  post \"sign_up\", to: \"registrations#create\"\n  get \"sign_in\", to: \"sessions#new\"\n  post \"sign_in\", to: \"sessions#create\"\n  delete \"sign_out\", to: \"sessions#destroy\"\n  root \"main#index\"\nend\n```\n### [Conclusion](#conclusion)\n\nCongratulations! You've built a real-time blog using Hotwire in Rails 8. This app demonstrates how to create dynamic, fast, and seamless user experiences with minimal code. Feel free to explore further and customize the app to suit your needs.\n\nIf you get stuck, check out the repository for reference.\n\nHappy coding! 🚀\n\nLet me know if you need further refinements or additional sections!\n## Authors\n\n- [@jaythree](https://github.com/giljr)\n\n\n## Acknowledgements\n\n - [Hotwire Intro Series](https://medium.com/jungletronics/hotwire-demo-intro-12afa9eec059)\n - [Hotwire Chat App Series](https://medium.com/jungletronics/hotwire-chat-app-building-a-scalable-infrastructure-with-docker-84a003dc75fd)\n - [Hotwire Demo: Broadcasting](https://medium.com/jungletronics/hotwire-demo-broadcasting-1bbc30599c8f)\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fgiljr%2Fhotwire-powered-blog","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fgiljr%2Fhotwire-powered-blog","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fgiljr%2Fhotwire-powered-blog/lists"}