GithubHelp home page GithubHelp logo

fewd-40's People

Contributors

danpitrowiski avatar

Watchers

James Cloos avatar avatar

fewd-40's Issues

FEWD Week #6 Project: CitiPix | Javascript

FEWD Week #6 Project: CitiPix | Javascript

Description

JavaScript is powerful: we're able to take user interaction and information and use it to update the page without requiring a refresh. This week, a new startup in your city, CitiPix, is looking to create a personalized picture app that allows users to store pictures they've taken around the world and quickly access them by typing in keywords or tags associated with each photo; they have asked for your help to start building the front-end prototype. You will begin by building a web-app that will take a user's input and update the background image of the page based on that input. Once again, you have been given the starter code that includes the HTML and the CSS. Use the images in the image folder and write JavaScript to make the background image reflect user input based on the Technical Requirements below.

Student: Dan Pitrowiski

Project URL: http://danpitrowiski.github.io/fewd-40/homework-city/index.html
Technical Requirements Does Not Meet Expectations (Red) Meets Expectations (Yellow) Exceeds Expectations (Green)
Call $.val() on inputs to get the string value of your user's input X
Store user input in var city X
Use $.on(submit) or $.click to figure out when the user clicks the "submit" button X
Create if / else if / else conditionals to control the flow of your application X
Write at least six different lines of pseudocode and display them inline as JavaScript comments X
Prevent a form submission using the event.preventDefault() function X
Use the $.ready() handler to delay your code from executing until all DOM assets have been loaded X
Get the first element from an attribute name using $.attr() X
Use the ` operator in your conditionals to allow for multiple string values to executeif/else if` statement code
If a user submits "New York" or "New York City" or "NYC" make the background of the page nyc.jpg X
If a user submits "San Francisco" or "SF" or "Bay Area" make the background of the page sf.jpg X
If a user submits "Los Angeles" or "LA" or "LAX" make the background of the page la.jpg X
If a user submits "Austin" or "ATX" make the background of the page austin.jpg X
If a user submits "Sydney" or "SYD" make the background of the page sydney.jpg X

TOTAL: Exceeds Expectations

FEWD Homework #1 | Portfolio Site

FEWD Week #1 Project: HTML/CSS Basics

Description

For the first assignment, you will begin creating the beginnings of your first website. Take what you've learned from class and build a portfolio site that showcases all of the projects you'll be completing over the next few weeks. Build two pages - an 'About Page' and a 'Portfolio' - that link to one another. Your 'About Page' should describe your mission and value proposition and your 'Portfolio' should include descriptions of the work you [will] do for Relaxr, Startup Matchmaker, and CitiPix.

Student: Dan Pitrowiski

Project URL: http://danpitrowiski.github.io/fewd-40/portfolio-site/index.html

Technical Requirements Does Not Meet Expectations (0) Meets Expectations (1) Exceeds Expectations (2)
Link both pages together using a tag X
Use a unique title and a single unique h1 tag X
Show images using img tags including unique alt attributes X
Use an external CSS stylesheet to style your pages X
Select at least 5 elements on the page and apply at least 5 different css properties (font-size, color, font-family, background, text-decoration) to these elements X
Use at least 6 different HTML tags (h1, h2, h3, h4, h5, h6, p, ul, ol, a, img) on your pages X
Follow naming conventions, maintain consistency across your .html and .css files X
Indent nested elements to increase your code's readability X

TOTAL: Exceeds Expectations

FEWD Week #4 Project: Relaxr | jQuery

FEWD Week #4 Project: Relaxr | jQuery

Description

The team from Relaxr is back...again! They want their page to be more interactive and asked you to add JavaScript to their source code. You've been given the HTML and CSS but will need to create a JavaScript file and add a few different pieces of interactivity: Users should be able to click a link and have the remainder of the blog's content slide down and appear on the page, both on the main content column and the side bar; users should also be able hide the content when they are finished reading. See a detailed technical explanation below.

Student: Dan Pitrowiski

Project URL: http://danpitrowiski.github.io/fewd-40/relaxr-app/blog.html
Technical Requirements Does Not Meet Expectations (0) Meets Expectations (1) Exceeds Expectations (2)
Use in-line-block or floats in your CSS to achieve a two-column layout- Prevent a form submission with the event.preventDefault() function X
Use the $.ready() handler to delay your code from executing until all DOM assets have been loaded X
Select the appropriate DOM elements with CSS selectors upon a user's click using the $.click() handler X
Have the text in the ````tag slide down along with a "Read Less" link in the blog post using,$.slideDown()and`$.show()``` X
Hide the "Read More" link using $.hide() X
Have the ````slide up and hide the "Read Less" link using,$.slideUp()and`$.hide()``` X
Show the "Read More" link using $.show() X
Using the same functions as above, if a user clicks the "Learn More" link in the sidebar, have the inside that slide down and hide the "Learn More" link using $.slideDown() and $.hide() X

TOTAL: Exceeds Expectations

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.