ARTICLE DETAIL

资讯详情

深耕网站视觉设计与运营推广的一线实战洞察。

Rails Girls 基础 Web 应用实战:用 `rails new` 创建 Touristic Autism 应用骨架

Rails Girls 基础 Web 应用实战:用 `rails new` 创建 Touristic Autism 应用骨架 教程后端【免费下载链接】guides.railsgirls.comRails Girls Guides项目地址https://gitcode.com/gh_mirrors/gu/guides.railsgirls.com点击查看免费下载本文以 Rails Girls 系列指南中的《Basic Web Application》对应仓库文档 _pages/touristic-autism_basic-app.md为主体面向 Rails Girls 工作坊参与者与初次接触 Ruby on Rails 的开发者完整讲解如何从零创建一个名为railsgirls-galway-2014的新 Rails 应用、启动本地开发服务器并验证安装是否成功。读完本文你将掌握跨平台macOS / Windows / Linux的终端操作差异、rails new生成的应用骨架结构以及 Model-View-ControllerMVC架构为何是理解后续一切 Rails 开发的基础。背景这篇指南在 Touristic Autism 教程系列中的位置这篇《Basic Web Application》是《Rails Girls Touristic Autism-friendly Spots App Tutorial》系列教程仓库文档 _pages/touristic-autism_intro.md中的第 1 步。整个系列的目标是构建一个自闭症友好旅游景点应用帮助自闭症成年人在旅行中描述、展示、评论旅游景点并对其自闭症友好程度进行评分——该应用需求由 Galway Autism Partnership 提出。系列共 8 步本篇是第一步也是后续所有步骤的地基基础 Web 应用本篇rails new创建应用版本控制与 Git资源建模user / place / comment 三大资源及关联资源评分letsrate 星评设计美化Bootstrap图片上传与缩略图 7.进阶持续部署 8.进阶持续测试与集成本篇合并、改编自 Rails Girls 基础 app 指南 以及 Ruby on Rails Tutorial 中创建应用的章节因此它与标准 Rails Girls 工作坊的第一课内容一脉相承。前置条件与重要提示开始之前请确认你的电脑上已经安装好Rails 与 Git。若尚未安装请先阅读仓库中的 安装指南该指南分别覆盖 macOS、Windows、Linux 与 Replit 等安装路径。重要提示必须根据你的操作系统选择对应的指令——Windows 上需要运行的命令与 Mac 或 Linux 略有不同。本文所有命令块都会同时给出两种版本请留意切换。第 1 步打开终端终端Terminal是执行命令行操作的地方不同系统的打开方式如下操作系统打开方式macOS打开 Spotlight输入Terminal点击Terminal应用Windows点击开始菜单找到Command Prompt命令行提示符点击Command Prompt with Ruby and RailsLinuxUbuntu/Fedora在 dash 中搜索Terminal并点击第 2 步创建应用railsgirls-galway-2014我们将在终端中依次执行下面的命令创建一个名为railsgirls-galway-2014的新 Rails 应用macOS / Linux 版本mkdir projects cd projects rails new railsgirls-galway-2014 rvm rubygems latest cd railsgirls-galway-2014 rails serverWindows 版本mkdir projects cd projects rails new railsgirls-galway-2014 cd railsgirls rails server每条命令的执行目的与验证方法如下mkdir projects创建一个名为projects的目录文件夹。mkdir是makedirectory创建目录的缩写。macOS/Linux 下用ls验证输出中应能看到projects目录Windows 下改用dir命令。cd projects进入刚才创建的projects目录。cd是changedirectory切换目录的缩写。再次运行ls或dir确认当前处于空目录中。rails new railsgirls-galway-2014在工作目录中创建一个全新的 Ruby on Rails 应用。该命令会自动生成包含app、config等众多子目录的完整应用骨架。注意命令的目录名与实际应用名要保持一致后续cd进入的是同一个名字。rvm rubygems latest仅 macOS/Linux 版本通过 RVM 将 RubyGems 更新到最新版本避免 gem 依赖解析出现问题。cd railsgirls-galway-2014进入 Rails 应用目录。此时运行ls或dir应能看到app、config等文件夹。rails server在本地启动 Rails 开发服务器。验证应用是否创建成功保持服务器运行在浏览器中打开 http://localhost:3000。如果看到Welcome aboardRails 欢迎页说明应用生成成功。关于 localhost它特指你自己的电脑本地主机开发服务器从这里启动。localhost 让开发者能在开发阶段直接在浏览器中查看和测试应用无需部署到公网。打开 http://localhost:3000 时地址栏中应能看到localhost:3000。如果你使用的是云端环境例如 Replit则改用其预览功能查看页面具体参见 Replit 安装指南。理解终端中的命令提示符变化启动rails server之后你会发现命令提示符消失了——因为当前终端窗口正在被 Rails 服务器占用macOS / Linux 下的正常提示符形如$Windows 下的正常提示符形如。当提示符不可见时你无法执行新的命令。此时如果强行输入cd或其他命令不会有任何反应。要退出服务器并恢复正常提示符请在终端中按下CtrlC这是 Rails 开发中最常用的一个组合键用于终止当前正在前台运行的进程。深入理解这几条命令到底做了什么Rails Girls 系列的配套文档 Guide to the Guide 对上述命令做了逐条拆解是理解本步骤原理的最佳参考mkdir projects—— 在当前目录通常是你的主目录创建一个叫projects的文件夹。cd projects—— 导航到刚创建的projects文件夹。rails new railsgirls-galway-2014—— 创建名为railsgirls-galway-2014的 Ruby on Rails 应用自动生成大量标准文件夹与文件。rails server—— 在电脑上启动一个本地 Web 服务器通过 http://localhost:3000 访问。这里值得注意rails new一次性生成的文件远不止app和config两个目录。完整骨架还包括模型/控制器/视图三层目录、路由配置、数据库迁移目录、Gemfile、测试目录等——这些正是下一步工作中要反复打交道的核心文件。从源码看rails new生成的是 MVC 骨架《Basic Web Application》文档在末尾点明了一个关键概念由rails new生成的骨架体现了Model-View-ControllerMVC架构模式。结合 Guide to the Guide 的 MVC 章节可以更完整地理解这一点标准 Rails 应用的app/目录下一开始就有三个关键子目录models、controllers和views模型Model代表应用中的资源定义如用户、想法、评论并负责与数据库通信控制器Controller充当模型与视图之间的中介接收浏览器请求、调用模型取数、再渲染视图视图View由 HTML 与内嵌 RubyERB组成最终生成返回给浏览器的页面。当浏览器请求一个页面时完整链路是浏览器 → 服务器 → 控制器 → 模型 → 数据库 → 模型返回数据 → 控制器渲染视图 → HTML 返回浏览器。理解了这条链路后续在本系列中创建place、comment资源时你就能清楚地知道每个文件的作用。教练提示本篇的教学要点本仓库中的文档采用 Jekyll 构建见 Gemfile并通过{% coach %}标签为教练提供专属提示。该标签由仓库中的 Liquid 插件 _plugins/coach.rb 实现——内容会以 Markdown 转换后渲染进一个带 Help from the coach 标题的提示框中。本页的教练要点是解释每一条命令的作用mkdir、cd、rails new、rails server解释rails new生成了什么解释rails server为什么必要、以及如何停止服务器。这些要点与 Guide to the Guide 第 1 节Create the application的内容完全对应工作坊参与者可以对照复习。操作系统差异速查表为方便对照将本步骤所有命令按系统整理如下操作macOS / LinuxWindows创建目录mkdir projectsmkdir projects验证目录lsdir进入目录cd projectscd projects创建应用rails new railsgirls-galway-2014rails new railsgirls-galway-2014gem 更新rvm rubygems latest无需执行进入应用目录cd railsgirls-galway-2014cd railsgirls启动服务器rails serverrails server验证页面浏览器打开 http://localhost:3000同左退出服务器CtrlCCtrlC注意原始文档中 Windows 分支存在一处命名不一致命令提示中应用名为railsgirls-galway-2014但cd时写为railsgirls。实操时请务必统一——用哪个名字创建应用就用哪个名字进入目录否则会因目录不存在而报错。常见问题与排错Q打开 http://localhost:3000 报错或页面打不开A确认rails server仍在运行终端没有回到提示符状态且没有别的进程占用 3000 端口。可先CtrlC停止服务器后重新rails server启动。Q提示 JavaScript / CoffeeScript 相关错误A如果终端出现疑似 JavaScript 或 CoffeeScript 的报错通常是系统缺少 Node.js 运行时常见于用gem install rails方式安装 Rails 的场景。安装 nodejs 即可解决若使用 RailsInstaller 安装则一般不会遇到此问题。Q如何确认自己当前在哪个目录AmacOS/Linux 用pwdprint working directory查看当前路径Windows 用cd不带参数查看。养成先确认路径再执行命令的习惯能避免在错误目录下创建应用。接下来做什么至此你已经拥有了一个可运行的基础 Rails 应用。按照系列教程的路线下一步是第 2 步用 Git 做版本控制——初始化仓库、提交并推送到远程第 3 步资源建模——为应用添加用户认证devise、景点place与评论comment资源后续的评分、设计、图片上传与部署步骤详见系列索引 _pages/touristic-autism_intro.md。如果对创建应用这一步还有疑问请在工作坊中随时向教练提问或者阅读 Guide to the Guide 中对应的概念讲解。基础打牢了后面的每一步都会水到渠成。赞分享教程后端【免费下载链接】guides.railsgirls.comRails Girls Guides项目地址https://gitcode.com/gh_mirrors/gu/guides.railsgirls.com点击查看免费下载相关推荐TanStack Table Preact 的 CreateTableHookResult 接口完全解析createTableHook 的返回值契约与组件组合实践TanStack Table Preact 的 CreateTableHookResult 接口完全解析createTableHook 的返回值契约与组件组合教程后端RxDB IndexedDB RxStorage 完全指南原理、性能优化、配置与限制RxDB IndexedDB RxStorage 完全指南原理、性能优化、配置与限制 IndexedDB RxStorage 是 RxDB 官方基于原生 In教程后端Rails Girls Touristic Autism-friendly Spots App用 letsrate 为景点加入多维度评分Rails Girls Touristic Autism friendly Spots App用 letsrate 为景点加入多维度评分 导读 本教程是 R教程后端上一篇终极百度网盘限速破解指南3步获取10倍下载速度的免费方案下一篇终极炉石传说游戏优化插件HsMod完整配置与使用指南创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考
返回列表