rails_Rails CableReady和刺激反射

rails

Hello world, welcome to this little blog post that intends just to remember those great benefits that you have when you work with tools like Ruby on Rails to rapidly build Web applications.

大家好，欢迎来到这篇小博文，它只是想记住您在使用Ruby on Rails之类的工具快速构建Web应用程序时所获得的巨大好处。

为什么选择Ruby on Rails？ (Why Ruby on Rails?)

I remember those days when Ruby on Rails come up to the scene and I was making Web Applications with PHP, there were other times, and I also learn a lot of OOP concepts then. Projects where you had to write/create every single file that your application goes to need, call it Classes, Stylesheets or JavaScript files.

我记得那些日子，当Ruby on Rails出现时，我用PHP制作Web应用程序的时候，还有其他时间，那时我还学习了很多OOP概念。 在您必须编写/创建应用程序所需的每个文件的项目中，将其称为类，样式表或JavaScript文件。

When I start using Rails, I was fascinated about the time that you save making a fully and functional CRUD for a “X” model, in this “new” framework (version 3, not the first version as you can see) I start making Web applications for Real Estate companies in really record times and I really focus in the architecture of the entire solution for problems of the customers/users, more than in the how’s that solution has to be build.

当我开始使用Rails时，我着迷于您节省了为“ X”模型制作功能全面的CRUD的时间，在这个“新”框架(版本3，而不是您看到的第一个版本)中，我开始制作房地产公司的Web应用程序确实创造了记录时间，我真正专注于解决客户/用户问题的整个解决方案的体系结构，而不仅仅是解决方案的构建方式。

新JavaScript框架的诞生 (The born of new JavaScript frameworks)

Then, you necessarily need JS to handle some things related with the client side, and frameworks like Angular, and React, just to mention some of them, come up to the scene to try to solve this needs, yes, but for issues of Google users and issues of Facebook users.

然后，您必然需要JS处理与客户端相关的某些事情，以及诸如Angular和React之类的框架(仅提及其中的一些问题) 应运而生 ，以尝试解决这一需求，是的，但是针对Google的问题用户和Facebook用户问题。

I don’t want to sound “incendiario”, but for those developers, and companies that make solutions based on Ruby on Rails framework, with the agile mindset, doesn’t need another framework to deal with the JS required. Even worst, we finish with a kind of Frankenstein web application that has some challenges each time that you add some new features. And when the times come, we want to migrate our appliation to a newer version of Rails, and then we notice that we have some(just to say a word) dependencies that make our labor even more challenging. But maybe that’s material for another post.

我不想听起来很“刺激”，但是对于那些以敏捷思维为基础，基于Ruby on Rails框架制作解决方案的开发人员和公司，不需要其他框架来处理所需的JS。 更糟糕的是，我们完成了一种科学怪人的 Web应用程序，每次添加一些新功能时都会遇到一些挑战。 时机成熟时，我们想将应用程序迁移到更新版本的Rails，然后我们注意到我们有一些(仅是一个词)依赖项，这使我们的工作更具挑战性。 但这可能对另一篇文章来说很重要。

This is how it looks a current Rails Application and another JavaScript framework

这就是当前的Rails应用程序和另一个JavaScript框架的外观

Then, you usually don’t manage just one application in your ecosystem, so it’s possible that your apps looks like this:

然后，您通常不只管理生态系统中的一个应用程序，因此您的应用程序可能如下所示：

Multiple Rails Applications with another JavaScript framework

具有另一个JavaScript框架的多个Rails应用程序

The original flow in a Rails Applications

Rails应用程序中的原始流程

为什么在我们的Rails应用程序中使用Stimulus而不是React或Angular JavaScript框架 (Why Stimulus instead of React or Angular JavaScript frameworks in our Rails Apps)

Have you seen the benefits that Turbolinks (more noticeable from the 5 version) has for your current Web application? Even better, you can use Turbolinks for your native iOS application and just reuse all you did in your current Rails Web Application (also in other framework/languages), we’re going to discuss how in my next post.

您是否看到了Turbolinks (从5版本开始更加明显)对于当前Web应用程序的好处？ 更好的是，您可以将Turbolinks用于本机iOS应用程序，并且仅重用您在当前的Rails Web应用程序(以及其他框架/语言)中所做的所有工作，我们将在下一篇文章中讨论如何进行。

但是，Turbolinks对我们有什么作用？ (But, what it does Turbolinks for us?)

Turbolinks is a Rails feature, available as a gem and enabled by default in new Rails apps. It is intended to speed up navigating between pages of your application.

Turbolinks是一种Rails功能，可作为gem使用，默认情况下在新的Rails应用程序中启用。 目的是加快应用程序页面之间的导航。

It works by intercepting all link clicks that would navigate to a page within the app, and instead makes the request via AJAX, replacing the body with the received content.

它的工作原理是拦截所有将导航到应用程序内页面的链接单击，然后通过AJAX发出请求，将正文替换为接收到的内容。

The primary speedup comes from not having to download or parse the CSS & JS files again.

主要的提速是因为不必再次下载或解析CSS和JS文件。

Check more about Turbolinks.

查看有关 Turbolink的 更多信息 。

我们要在这里建造什么？ (What we’re going to build here?)

In order to practice this concepts we’re going to make a new Rails 6 based Web Application and the StimulusReflex that intends to be the “new way to craft modern, reactive web interfaces with Ruby on Rails”, so let’s create a simple Chat Application, we’re going to call it LatinChat.

为了实践这些概念，我们将创建一个新的基于Rails 6的Web应用程序和StimulusReflex ，它们旨在成为“使用Ruby on Rails构建现代的，React性的Web界面的新方法”，因此让我们创建一个简单的Chat Application ，我们将其称为LatinChat。

创建Rails 6新应用程序 (Creating the Rails 6 new Application)

Asuming that you already have Rails 6 (the minimum version to use the new benefits of Turbolinks is 5) gem installed and Ruby 2.7 installed, lets run the next linke in the terminal:

假设您已经安装了Rails 6(使用Turbolinks的新功能的最低版本是5)gem和Ruby 2.7，请在终端中运行下一个链接：

rails new --skip-spring --webpack=stilmulus latinchat
cd latinchat
bundle add redis cable_ready stimulus_reflex
yarn add cable_ready stimulus_reflex
bundle exec rails stimulus_reflex:install

Now we should have a basic Rails Application with stimulus and reflex ready to use.

现在，我们应该可以使用具有刺激和反射功能的基本Rails应用程序了。

You can use other method instead of the scaffold if you prefer.

如果愿意，可以使用其他方法代替脚手架。

$ rails g scaffold Post username:string body:text likes_count:integer reposts_count:integer --skip-jbuilder

Then, we should do some adjusts to just created controllers and views, in order to use just that we need. in This case, you can go this url and check out the repo latintwit made along with this post.

然后，我们应该对刚刚创建的控制器和视图进行一些调整，以便仅使用我们需要的控制器和视图。 在这种情况下，您可以转到此URL并检查与此帖子一起制作的回购latintwit 。

You should refactor the views(implement some bootstrap) and the Post controller as well acording this repo. Feel free for send your thoughts and comments.

您应该重构视图(实现一些引导程序)和Post控制器以及相应的repo 。 随时发送您的想法和意见。

Twitter: @emmanueloseguer

推特：@emmanueloseguer

翻译自: https://medium.com/@emmanuel.oseguera/rails-cableready-and-stimulus-reflex-a90dc297a975

rails