Upload
perry-carbonell
View
126
Download
2
Tags:
Embed Size (px)
DESCRIPTION
From the post: http://wp.me/p2tuoA-3e
Citation preview
Ruby on Rails
A playful guidePerry Carbonell | Sep 2013
Applications are typically constructed using a bunch of files located in your local folders. Ruby on Rails is no different; it has a bunch of files embedded in particular folders which serve a particular purpose. Michael Hartl describes this (re: table 1.1) as follows:
Here’s what you needSublime
Text
C:\
localhost:3000 database
To start ROR, you need a file editor. Notepad comes default with most PC’s but the power of Sublime Text is head and shoulders above the trusty Notepad. I’ll use this symbol to describe Sublime Text more:
Like I said in my earlier statement, files live in folders within your computer. I’ll use this symbol to describe folder directory: Folder Directory
You will also need a tool to run commands on your computer. Some people like the visual nature of IDE’s for running commands. I’m a little old school and use Git Bash to run my commands. Here’s my symbol:
You will eventually reach a stage where you will need to deploy your code in your local (development) environment. Here’s my representation of your local including a database:
Finally you need to use your internet to get to a few other resources such as:
GitHub (web-based version control)
Heroku (your cloud production platform)
Heroku database
GitHub site Git Version files
Blue to denote web-based. I’ll explain these more later.
Here’s what’s happening | Sublime Text
Sublime Text
C:\
localhost:3000database
Directory1
Heroku database
Git Hub
1 Use Sublime Text to code. With ROR, this could be anything from Ruby to HTML, CSS, Javascript languages. It will therefore work to your advantage to have a good working knowledge of these languages prior working with ROR. 2 These files live in several folders within your directory (re: slide 2).
2
Here’s what’s happening | Command Line
Sublime Text
C:\
localhost:3000database
Directory
1
Heroku database
Git Hub
1 Use Command Line to make files, move files, commit, merge, push etc. Command lines are exactly that, they are commands that execute some action on your application. I’m using Git Bash for this purpose.2 Once you initially push, your code is uploaded to your development environment (locahost:3000).The application is connected to a database (SQL Lite for standard ROR) and you use the command line to manipulate the database.
2
Here’s what’s happening | Git Hub & Heroku
Sublime Text
localhost:3000database
Directory
1
Heroku database
GitHub
C:\2
1 GitHub is used as a version control system. As soon as you’re happy with your development code, you can push the code up to GitHub. You can now perform further development on your local environment knowing that you have GitHub as back-up (it mimics the file and folder directory structure shaded in grey on the right..2 Heroku can be treated as your production environment. It also has its own database which is important to note.
Here’s what’s happening | Dev vs Prod
Sublime Text
C:\
localhost:3000database
Directory
Heroku database
Git Hub
Development Environment(local drive)
Production Environment(on the WEB)
Here’s what it really looks like
Sublime Text
C:\
Directory
My Representation The Real Thing
Here’s what it really looks likeMy Representation The Real Thing
Heroku
GitHub
Here’s what’s happening | with HTML
C:\
database
Directorystyle in CSS
behaviour in JavaScript and Ruby
structure in HTML
Wiki says:
It basically provides the structure for your web page. Here’s a sample:
HyperText Markup Language (HTML) is the main markup language for creating web pages and other information that can be displayed in a web browser.
HTML is written in the form of HTML elements consisting of tags enclosed in angle brackets (like <html>), within the web page content. HTML tags most commonly come in pairs like <h1> and </h1>, although some tags represent empty elements and so are unpaired, for example <img>. The first tag in a pair is the start tag, and the second tag is the end tag (they are also called opening tags and closing tags). In between these tags web designers can add text, further tags,
My say:
Here’s what’s happening | with CSS
C:\
database
Directorystyle in CSS
behaviour in JavaScript and Ruby
structure in HTML
Wiki says:
This is your presentation layer. Here’s a sample:
Cascading Style Sheets (CSS) is a style sheet language used for describing the presentation semantics (the look and formatting) of a document written in a markup language. Its most common application is to style web pages written in HTMLand XHTML, but the language can also be applied to any kind of XML document, including plain XML, SVG and XUL.
CSS is designed primarily to enable the separation of document content (written in HTML or a similar markup language) from document presentation, including elements such as the layout, colors, and fonts.
My say:
Here’s what’s happening | Website composition
C:\
database
Directorystyle in CSS
behaviour in JavaScript and Ruby
structure in HTML
Wiki says:
It facilitates user interaction. Here’s a sample embedded within HTML:
JavaScript (JS) is an interpreted computer programming language.[5] As part of web browsers, implementations allow client-side scripts to interact with the user, control the browser, communicate asynchronously, and alter the document
contentthat is displayed.[5] It has also become common in server-side programming, game development and the creation of desktop applications.
My say:
Here’s what’s happening | with Ruby
C:\
database
Directorystyle in CSS
behaviour in JavaScript and Ruby
structure in HTML
Wiki says:
Ruby on Rails is the framework whereas Ruby is the language. Here’s a Ruby snip:
Ruby is a dynamic, reflective, object-oriented, general-purpose programming language. It was designed and developed in the mid-1990s by Yukihiro "Matz" Matsumoto in Japan.
Ruby embodies syntax inspired by Perl with Smalltalk-like features and was also influenced by Eiffel and Lisp.[8] It supports multiple programming paradigms, including functional, object oriented, and imperative. It also has a dynamic type system and automatic memory management.
My say:
Here’s what’s happening | with Command Line
C:\
database
Directorystyle in CSS
behaviour in JavaScript and Ruby
structure in HTML
Wiki says:
Implement your code by giving it commands. Here, I’m in the process of going in to my working folder:
A command-line interface (CLI), also known as command-line user interface, console user interface,[1] and character user interface (CUI), is a means of interacting with a computer program where the user (or client) issues commands to the program in the form of successive lines of text (command lines).
The CLI was the primary means of interaction with most popular operating systems in the 1970s and 1980s, including MS-DOS, CP/M, Unix, and Apple DOS. The interface is usually implemented with a command line shell, which is a program that accepts commands as text input and converts commands to appropriate operating system functions.
My say:
Here’s what’s happening | with the database
C:\
database(db)
Directorystyle in CSS
behaviour in JavaScript and Ruby
structure in HTML
Wiki says:
The first sentence in the Wiki says it all.
FYI if you use ROR, here’s a link to some Rails Command Lines. Within this you will find the code
rake db:migrate
which is one of the most important command you will be using (it modifies the db schema).
A database is an organized collection of data. The data are typically organized to model relevant aspects of reality in a way that supports processes requiring this information. For example, modeling the availability of rooms in hotels in a way that supports finding a hotel with vacancies.
Database management systems (DBMSs) are specially designed applications that interact with the user, other applications, and the database itself to capture and analyze data. A general-purpose database management system (DBMS) is a software system designed to allow the definition, creation, querying, update, and administration of databases.
My say:
The Wrap
Now there’s a lot of things going on here for a beginner as you can see. There’s only so much you can learn in a month’s time so when approaching something with a scope as large as this, it’s probably not a bad idea to break things down into smaller bite size chunks.
Having a closer look into slides 10 - 15, basically the composition of a web app, I’ve decided to go ‘Back to the Basics’ and pick-up the fundamentals in the order of the slides I have listed i.e. HTML 5 first, CSS next and so on.
I hope these slides help others out there. At the very least, I intend to look back on this and remind myself where it all began.
Until the next blog, take care out there and happy coding.
Perry [email protected]