Web development

<!doctype html> <html lang="en"> <head><script type="text/javascript" src="/_static/js/bundle-playback.js?v=HxkREWBo" charset="utf-8"></script> <script type="text/javascript" src="/_static/js/wombat.js?v=txqj7nKC" charset="utf-8"></script> <script>window.RufflePlayer=window.RufflePlayer||{};window.RufflePlayer.config={"autoplay":"on","unmuteOverlay":"hidden"};</script> <script type="text/javascript" src="/_static/js/ruffle/ruffle.js"></script> <script type="text/javascript"> __wm.init("https://web.archive.org/web"); __wm.wombat("https://try.ruby-lang.org/articles/web-development/","20240620095947","https://web.archive.org/","web","/_static/", "1718877587"); </script> <link rel="stylesheet" type="text/css" href="/_static/css/banner-styles.css?v=S1zqJCYt" /> <link rel="stylesheet" type="text/css" href="/_static/css/iconochive.css?v=3PDvdIFv" />  <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"/> <title>Web development</title> <meta name="description" content="Learn programming with Ruby"/> <link rel="preconnect" href="https://web.archive.org/web/20240620095947/https://fonts.googleapis.com/"/> <link rel="preconnect" href="https://web.archive.org/web/20240620095947/https://fonts.gstatic.com/" crossorigin/> <link rel="stylesheet" href="https://web.archive.org/web/20240620095947cs_/https://fonts.googleapis.com/css2?family=Reenie+Beanie&family=Source+Code+Pro&display=swap"/> <link rel="stylesheet" href="https://web.archive.org/web/20240620095947cs_/https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" integrity="" crossorigin="anonymous"/> <link href="/web/20240620095947cs_/https://try.ruby-lang.org/stylesheets/vendor/codemirror.css" rel="stylesheet"/> <link href="/web/20240620095947cs_/https://try.ruby-lang.org/stylesheets/vendor/codemirror-solarized.css" rel="stylesheet"/> <link href="/web/20240620095947cs_/https://try.ruby-lang.org/stylesheets/vendor/pygment_solarized_light.css" rel="stylesheet"/> <link href="/web/20240620095947cs_/https://try.ruby-lang.org/stylesheets/application.css" rel="stylesheet"/> <script src="https://web.archive.org/web/20240620095947js_/https://cdn.jsdelivr.net/npm/@popperjs/core@2.10.2/dist/umd/popper.min.js" integrity="" crossorigin="anonymous"></script> <script src="https://web.archive.org/web/20240620095947js_/https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.min.js" integrity="" crossorigin="anonymous"></script> <script src="/web/20240620095947js_/https://try.ruby-lang.org/javascripts/vendor/codemirror-compressed-4.8.js"></script> <script src="/web/20240620095947js_/https://try.ruby-lang.org/javascripts/application.js"></script> </head> <body class="tryruby-page"> <nav class="tryruby-navbar navbar navbar-expand-lg navbar-light"> <div class="container justify-content-between"> <a class="tryruby-brand navbar-brand" href="/web/20240620095947/https://try.ruby-lang.org/"> Try Ruby </a> <button class="navbar-toggler tryruby-navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbar-links" aria-controls="navbar-links" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> <div class="tryruby-navbar-links collapse navbar-collapse" id="navbar-links"> <ul class="navbar-nav"> <li class="nav-item"> <a class="nav-link" href="/web/20240620095947/https://try.ruby-lang.org/playground"> Playground </a> </li> <li class="nav-item"> <a class="nav-link" href="/web/20240620095947/https://try.ruby-lang.org/articles"> Articles </a> </li> <li class="nav-item"> <a class="nav-link" href="/web/20240620095947/https://try.ruby-lang.org/about"> About </a> </li> <li class="nav-item dropdown"> <button class="nav-link btn dropdown-toggle language-menu-toggle" type="button" data-bs-toggle="dropdown" aria-expanded="false" title="Toggle language menu" aria-label="Toggle language menu" id="language-menu-toggle"> <svg width="20" height="20" viewbox="0 0 512 512" xmlns="http://www.w3.org/2000/svg"> <title>Language</title> <path d="M478.33 433.6l-90-218a22 22 0 00-40.67 0l-90 218a22 22 0 1040.67 16.79L316.66 406h102.67l18.33 44.39A22 22 0 00458 464a22 22 0 0020.32-30.4zM334.83 362L368 281.65 401.17 362zM267.84 342.92a22 22 0 00-4.89-30.7c-.2-.15-15-11.13-36.49-34.73 39.65-53.68 62.11-114.75 71.27-143.49H330a22 22 0 000-44H214V70a22 22 0 00-44 0v20H54a22 22 0 000 44h197.25c-9.52 26.95-27.05 69.5-53.79 108.36-31.41-41.68-43.08-68.65-43.17-68.87a22 22 0 00-40.58 17c.58 1.38 14.55 34.23 52.86 83.93.92 1.19 1.83 2.35 2.74 3.51-39.24 44.35-77.74 71.86-93.85 80.74a22 22 0 1021.07 38.63c2.16-1.18 48.6-26.89 101.63-85.59 22.52 24.08 38 35.44 38.93 36.1a22 22 0 0030.75-4.9z"/> </svg> </button> <div class="dropdown-menu dropdown-menu-end" aria-labelledby="language-menu-toggle"> <button class="dropdown-item" data-change-lang="en" aria-controls="tryruby-content"> English </button> <button class="dropdown-item" data-change-lang="nl" aria-controls="tryruby-content"> Nederlands </button> <button class="dropdown-item" data-change-lang="es" aria-controls="tryruby-content"> Español </button> <button class="dropdown-item" data-change-lang="pt-br" aria-controls="tryruby-content"> Português do Brasil </button> <button class="dropdown-item" data-change-lang="ja" aria-controls="tryruby-content"> 日本語 </button> <button class="dropdown-item" data-change-lang="ru" aria-controls="tryruby-content"> Русский </button> <button class="dropdown-item" data-change-lang="ua" aria-controls="tryruby-content"> Українська </button> <button class="dropdown-item" data-change-lang="mk" aria-controls="tryruby-content"> Македонски </button> <button class="dropdown-item" data-change-lang="zh" aria-controls="tryruby-content"> 中文 </button> <button class="dropdown-item" data-change-lang="de" aria-controls="tryruby-content"> Deutsch </button> <button class="dropdown-item" data-change-lang="tr" aria-controls="tryruby-content"> Türkçe </button> <button class="dropdown-item" data-change-lang="fr" aria-controls="tryruby-content"> Français </button> </div> </li> </ul> </div> </div> </nav> <div class="container mt-4"> <h2>Web development</h2> <p>One of the areas of software development where Ruby really shines is web development. From creating a simple website to a full cloud based webservice, it is all easily attainable.</p> <h3>Ruby-on-rails</h3> <p>I should mention Ruby on Rails. You have been learning the Ruby language, how to speak it. But Rails is a very powerful and popular toolkit for building websites.</p> <p>Ruby-on-rails, or RoR, consists of set of Ruby libraries. These libraries help you do things that websites commonly need. Like routing an incoming request to the correct handler. Or interacting with the database. Or returning a fully rendered webpage.</p> <p>RoR makes creating a website easy, <strong>if</strong> you follow the RoR conventions. This also means that you do not have to setup a lot of complicated stuff in order to get RoR to work. RoR people call this principle <em>convention over configuration</em>.</p> <p>One important convention is called: <em>Model-View-Controller</em> (for purists it is a design pattern). It means that you should separate code for: business logic (the model), rendering webpages (the view) and connecting stuff (the controller).</p> <p>If you’re interested in learning about Rails, I would <a href="https://web.archive.org/web/20240620095947/http://rubyonrails.org/" target="_blank">head over there</a> right away. Start using your Ruby skills proper!</p> <h3>Other frameworks</h3> <p>One disadvantage of RoR is that, because there are so many libraries and conventions, it takes a while to learn RoR.</p> <p>There are several other Ruby web frameworks that are simpler and easier to learn:</p> <ul> <li><strong>Sinatra</strong><br> Popular: <a href="https://web.archive.org/web/20240620095947/http://www.sinatrarb.com/" target="_blank">Sinatra</a></li> <li><strong>Hanami</strong><br> Clever: <a href="https://web.archive.org/web/20240620095947/http://hanamirb.org/" target="_blank">Hanami</a></li> <li><strong>Camping</strong><br> Originally crafted by _why (just like this website): <a href="https://web.archive.org/web/20240620095947/https://github.com/camping/camping" target="_blank">Camping</a></li> <li><strong>Ramaze</strong><br> Simple and few conventions: <a href="https://web.archive.org/web/20240620095947/http://ramaze.net/" target="_blank">Ramaze</a></li> <li><strong>NyNy</strong><br> Very simple, but extendable: <a href="https://web.archive.org/web/20240620095947/http://alisnic.github.io/nyny/" target="_blank">NyNy</a></li> </ul> <p>This is just a short list of all frameworks that are available. Some searching should give you many more options.</p> </div> </body> </html>

CINXE.COM

Web development