In a web application you often need to move data between the client (HTML, Javascript) and the server (Ruby, Rails).
Add a find-as-you-type search to MovieDB. Above the list of movies there should be a text input that updates the list with the search results as the user is typing in the query. The user should not have to press a "Search" button (hint: you can bind to the [input
](https://makandracards.com/makandra/33699-input-a-dom-event-that-is-fired-whenever-a-text-field-cha...
Read the following Rubymonk articles:
Understand all the terms in How Ruby method lookup works, in particular:
include
extend
prepend
Do you understand why object.extend(SomeModule)
is the same as object.singleton_class.include(SomeModule)
?
How does include
and extend
work together with inheritance?
You may also read more about the Ruby Object Model, if all o...
Movies in MovieDB should have one of the following workflow states:
draft
pending
published
declined
A movie always begins as a draft
and then transitions through the states as it's getting reviewed. This could be a typical state flow for a movie:
stateDiagram-v2
[*] --> draft
draft --> pending
pending --> declined: Reason
declined --> pending
pending --> published
Change the visibility rules (Consul powers) so:
On the start page of your Movie DB, show the title of a random movie that is coming soon to theaters.
Tip
Consider the best place to put the new logic. Should it be an existing class or a new class?
Automatically ret...
Jasmine is a great tool to unit test your JavaScript components without writing an expensive end-to-end test for every little thing.
Jasmine is a purely client-side tool. It cannot ask Rails to render a view or access the database. Any HTTP calls must be mocked.
Just as unit tests are a direct way to closely look at your classes, Jasmine is a very direct way to look at your JavaScript components.
For example, when you want to test that a date picker opens a calenda...
Add the following feature to MovieDB:
Read the following material:
If you've stumbled over display: grid
while reading the Flexbox material of the previous card - we've got you covered!
Let's dive into this topic with a quote:
Flexbox is made for one-dimensional layouts and Grid is made for two-dimensional layouts.
You will learn more subtle differences in the linked material below, but you can remember this as a rule of thumb.
Many of our clients can't or don't want to design their user interfaces. In the absence of a good UI design, you should always be able to come up with a default. Since the user interface makes up 70% of a typical web application, this is closely related to requirements analysis and cost estimation.
Talk with your mentor about the following topics:
Read the following chapters from our book Growing Rails Applications in Practice:
Discuss each chapter with your mentor.
Work through the follow resources:
Talk to your mentor about how we're approaching applications that are either old or abandoned by a different team earlier:
bundle && rake db:create db:migrate
).Goal of this lesson is to understand what middlewares in Rack are good for.
Start with these articles:
You should be able to answer the following questions:
Some tasks in a web application are better not done live when a user request a page, but in the background. Examples are
Our two main mechanisms for background processing are
ActionView::Helpers::NumberHelper
Accept-Language
HTTP header. Can be parsed with a gem like [accept_language](https://github.com/cyril/accept_lan...Web technology is a broad field and you cannot be an expert in all aspects.
However, it is useful to have a rough understanding of common terms and buzzwords, so that you don't seem uninformed when talking to a client or other developers.
Search the Internet for each of the following terms. Only take a couple of minutes for each and don't get into too much detail. Do get a rough idea about the advantages they promise.
Continuous Integration
or CI
Single-Page Application
or SPA
rake
good for?rake -T
within a Rails project)rake stats
task in the Rails gems:environment
.For each movie in MovieDB, we want to track which other movie it was inspired by. For example:
Start by adding a field Movie#inspiration_id
. In the movie form, I should be able to select the inspiring movie.
The list should:
In the...
Rails ships with two separate build pipelines: Sprockets ("asset pipeline") and Webpacker.
Webpacker has many more moving parts, but allows us to use ES6 modules and npm packages (through Yarn). Webpacker is a wrapper around a JavaScript project called webpack.
Yarn is the package manager we use for JavaScript. It does for JavaScript roughly what Bundler does for Ruby.
Read the first couple of sections of its official documentation.
You should learn how to:
Talk with a colleague and find out why we're using building some of our sites using static site generators instead of Rails.
You should talk about:
Read through the Middleman docs:
.png
) and vector images (like .svg
).png
webp
gif
jpg
svg
Browse the i...