Giter Club home page Giter Club logo

basic-sinatra-forms-lab-online-web-pt-120919's Introduction

Sinatra Forms Lab

Overview

In this lab, you'll practice building forms in Sinatra by creating a basketball team sign-up sheet. Your application will have a basic HTML form, and will display the data from the form after it has been submitted by the user.

Instructions

  1. Run bundle install

  2. Run shotgun

  3. Make a form

    Create a route that responds to a GET request at /newteam. Add a form to the newteam.erb template and render it in the GET /newteam route.

    The form should have fields for: Team name ('name') Coach ('coach') Point Guard ('pg') Shooting Guard ('sg') Power Forward ('pf') Small Forward ('sf') Center ('c')

It should look something like this:

form for basketball team

When creating your form, your "Submit" button will need to be identified by an id attribute with value of "Submit". We're telling this to you now because our test frame work, Capybara, requires buttons to be findable by an id, title, or value attribute.

  1. Handle form submission

    Create a route that responds to a POST request at /team Have the form send a POST request to this route. Upon submission, pass the submitted data to the team.erb template.

  2. Final Output

    Update the team.erb template so when you post to this form, it displays the name of the team and each member of the team.

    Your view should display something like this:

    completed form

  3. Deliverables

Pass the tests! Make sure you read the test output carefully!

Resources

View Sinatara Forms Lab on Learn.co and start learning to code for free.

basic-sinatra-forms-lab-online-web-pt-120919's People

Contributors

annjohn avatar danielseehausen avatar dependabot[bot] avatar dfenjves avatar echospr avatar ipc103 avatar jmburges avatar maxwellbenton avatar mendelb avatar pletcher avatar rishter avatar sgharms avatar snsavage avatar sylwiavargas avatar victhevenot avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.