Ruby on Rails Post项目设置网站初始界面

2024-06-21 00:04

本文主要是介绍Ruby on Rails Post项目设置网站初始界面,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

在构建了Ruby的Web服务器后,第三步就可以去掉框架的官方页面,设置自己的网页初始页了。

Linux系统安装Ruby语言-CSDN博客 、在Ubuntu中创建Ruby on Rails项目并搭建数据库-CSDN博客、

Ruby语言建立Web服务器-CSDN博客

了解Ruby onRails项目中的主要文件夹

Ruby on Rails项目的Web网页视图文件为.erb文件,编写方法和HTML文件很相似(PHP也差不多),.erb文件通常放在  \项目文件夹\app\views\posts 文件夹里,Ruby on Rails的Post项目中主要文件夹和作用如下:

  1. app文件夹:这是项目的核心部分,包含了应用的大部分代码。

    • controllers:存放驱动业务逻辑的控制器文件。这些文件定义了应用程序中不同部分的行为和响应。
    • helpers:存放视图辅助类,包含一些常用的代码段,用于在视图中简化复杂的输出逻辑。
    • models:存放数据模型文件,定义了数据描述结构、验证和完整性规则等。这些模型通常与数据库表相对应。
    • views:存放生成HTML的模板文件,也可以存放CSS和图片。这些文件负责应用的用户界面显示。
  2. config文件夹:存放与服务器、数据库或其他依赖相关的配置文件。

    • database.yml:用于配置Ruby程序和数据库的连接。
    • routes.rb:定义了应用程序的路由设置,指定如何将进来的请求转发到相应的控制器和动作。
  3. db文件夹:主要用于存储开发人员编写的数据库迁移文件和模式文件,这些文件用于管理数据库的结构和版本。

  4. doc文件夹:存放Rails应用的文档,包括自动生成的rdoc文档和其他相关文档。

  5. lib文件夹:存放应用程序运行过程中所需要的类库文件,这些类库不属于控制器、视图和辅助类。

  6. log文件夹:用于存放程序运行期间产生的日志文件,包括development.log、test.log和production.log等,这些文件记录了应用程序的运行信息和错误。

  7. public文件夹:存放Rails应用的静态资源,如图片、JavaScript脚本、CSS样式等。这些资源可以直接通过Web服务器访问。

  8. script文件夹:存放一些有用的脚本文件,用于启动和生成代码等操作。

  9. test文件夹:用于存放单元测试和集成测试的文件,这些文件用于验证应用程序的功能和性能。

  10. vendor文件夹:存放一些程序依赖的外部类库和插件,这些类库可以被自动加载。

创建网页初始页面

运行前首先找到posts文件夹,里面存放了允许开发者在HTML结构中嵌入Ruby代码的.erb文件,Ruby代码通常被包含在<% %>标签中,用于执行逻辑操作,而<%= %>标签则用于输出Ruby表达式的值到HTML中。

可以先简单修改 index.html.erb 文件内容如下:

<!DOCTYPE html>  
<html lang="zh">  
<head>  <meta charset="UTF-8">  <meta name="viewport" content="width=device-width, initial-scale=1.0">  <title>happy gay</title>  <style>  body {  font-family: Arial, sans-serif;  margin: 0;  padding: 0;  background-color: #f2f2f2;  }  .container {  max-width: 960px;  margin: 0 auto;  padding: 20px;  }  h1 {  color: #333;  text-align: center;  }  p {  color: #666;  line-height: 1.6;  }  </style>  
</head>  
<body>  <div class="container">  <h1>OH yeah!</h1>  <p>这是第一个Ruby页面</p>  <p>GGBoys!!!!</p>  </div>  
</body>  
</html>

 修改路由设置文件

routes.rb文件使用一种DSL(领域特定语言)来描述应用中的路由结构,定义应用程序中所有路由。

在 config/routes.rb 文件中修改路由设置,指向posts文件夹:

Rails.application.routes.draw doresources :postsroot to: 'posts#index' # 应用程序的根URL路由
end

原版如下,上述代码是我修改了的:

Rails.application.routes.draw doresources :postsGET /posts => posts#index GET /posts/new => posts#new POST /posts => posts#create GET /posts/:id => posts#show GET /posts/:id/edit => posts#edit PATCH/PUT /posts/:id => posts#update DELETE /posts/:id => posts#destroy 
end

修改控制器文件

在Ruby on Rails中,PostsController 是一个控制器类,它处理与Post模型相关的请求。控制器是MVC(Model-View-Controller)架构中的“C”部分,负责接收用户请求,处理业务逻辑,并准备数据以供视图(View)使用。

@posts = Post.all 这行代码会查询数据库,获取所有的Post记录,并将它们存储在实例变量@posts中,espond_to块允许控制器根据不同的请求格式返回不同的响应,如果请求的格式是HTML(通常是浏览器请求),Rails会默认渲染与index方法同名的视图模板,即app/views/posts/index.html.erb。这个视图模板会使用@posts变量来动态生成HTML内容,如果请求的格式是JSON(常见于API请求),Rails会返回一个包含所有帖子数据的JSON响应。这里,render json: @posts会将@posts数组转换为JSON格式,并作为响应体返回。

在 /app/controllers/posts_controller.rb 文件中添加一个index方法来渲染index.html.erb视图

class PostsController < ApplicationController# GET /postsdef index@posts = Post.allrespond_to do |format|format.html # index.html.erbformat.json { render json: @posts }endend
end

运行文件

rails server

运行成功: 

这篇关于Ruby on Rails Post项目设置网站初始界面的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/1079643

相关文章

golang内存对齐的项目实践

《golang内存对齐的项目实践》本文主要介绍了golang内存对齐的项目实践,内存对齐不仅有助于提高内存访问效率,还确保了与硬件接口的兼容性,是Go语言编程中不可忽视的重要优化手段,下面就来介绍一下... 目录一、结构体中的字段顺序与内存对齐二、内存对齐的原理与规则三、调整结构体字段顺序优化内存对齐四、内

nginx部署https网站的实现步骤(亲测)

《nginx部署https网站的实现步骤(亲测)》本文详细介绍了使用Nginx在保持与http服务兼容的情况下部署HTTPS,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值... 目录步骤 1:安装 Nginx步骤 2:获取 SSL 证书步骤 3:手动配置 Nginx步骤 4:测

CSS弹性布局常用设置方式

《CSS弹性布局常用设置方式》文章总结了CSS布局与样式的常用属性和技巧,包括视口单位、弹性盒子布局、浮动元素、背景和边框样式、文本和阴影效果、溢出隐藏、定位以及背景渐变等,通过这些技巧,可以实现复杂... 一、单位元素vm 1vm 为视口的1%vh 视口高的1%vmin 参照长边vmax 参照长边re

配置springboot项目动静分离打包分离lib方式

《配置springboot项目动静分离打包分离lib方式》本文介绍了如何将SpringBoot工程中的静态资源和配置文件分离出来,以减少jar包大小,方便修改配置文件,通过在jar包同级目录创建co... 目录前言1、分离配置文件原理2、pom文件配置3、使用package命令打包4、总结前言默认情况下,

Windows设置nginx启动端口的方法

《Windows设置nginx启动端口的方法》在服务器配置与开发过程中,nginx作为一款高效的HTTP和反向代理服务器,被广泛应用,而在Windows系统中,合理设置nginx的启动端口,是确保其正... 目录一、为什么要设置 nginx 启动端口二、设置步骤三、常见问题及解决一、为什么要设置 nginx

python实现简易SSL的项目实践

《python实现简易SSL的项目实践》本文主要介绍了python实现简易SSL的项目实践,包括CA.py、server.py和client.py三个模块,文中通过示例代码介绍的非常详细,对大家的学习... 目录运行环境运行前准备程序实现与流程说明运行截图代码CA.pyclient.pyserver.py参

vue基于ElementUI动态设置表格高度的3种方法

《vue基于ElementUI动态设置表格高度的3种方法》ElementUI+vue动态设置表格高度的几种方法,抛砖引玉,还有其它方法动态设置表格高度,大家可以开动脑筋... 方法一、css + js的形式这个方法需要在表格外层设置一个div,原理是将表格的高度设置成外层div的高度,所以外层的div需要

电脑密码怎么设置? 一文读懂电脑密码的详细指南

《电脑密码怎么设置?一文读懂电脑密码的详细指南》为了保护个人隐私和数据安全,设置电脑密码显得尤为重要,那么,如何在电脑上设置密码呢?详细请看下文介绍... 设置电脑密码是保护个人隐私、数据安全以及系统安全的重要措施,下面以Windows 11系统为例,跟大家分享一下设置电脑密码的具体办php法。Windo

IDEA运行spring项目时,控制台未出现的解决方案

《IDEA运行spring项目时,控制台未出现的解决方案》文章总结了在使用IDEA运行代码时,控制台未出现的问题和解决方案,问题可能是由于点击图标或重启IDEA后控制台仍未显示,解决方案提供了解决方法... 目录问题分析解决方案总结问题js使用IDEA,点击运行按钮,运行结束,但控制台未出现http://

解决IDEA使用springBoot创建项目,lombok标注实体类后编译无报错,但是运行时报错问题

《解决IDEA使用springBoot创建项目,lombok标注实体类后编译无报错,但是运行时报错问题》文章详细描述了在使用lombok的@Data注解标注实体类时遇到编译无误但运行时报错的问题,分析... 目录问题分析问题解决方案步骤一步骤二步骤三总结问题使用lombok注解@Data标注实体类,编译时