Skip to content

Commit

Permalink
Update README.md
Browse files Browse the repository at this point in the history
  • Loading branch information
cameronwp committed Dec 19, 2014
1 parent 563a0cf commit 7ac037a
Showing 1 changed file with 56 additions and 11 deletions.
67 changes: 56 additions & 11 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,8 +1,6 @@
# The Resume Project

## How do I complete this project?

1. If you need a refresher on JavaScript syntax, go to the [Javascript Basics course](https://www.udacity.com/course/viewer#!/c-ud804-nd); if you would like to understand how this project is manipulating and traversing the DOM, check out [Intro to jQuery](https://www.udacity.com/course/ud245-nd).
1. Go to the [Javascript Basics course](https://www.udacity.com/course/ud804) and select "View Course Materials."
2. Go through the videos and assignments in this course to learn the JavaScript necessary to build your resume.
3. Review your work against the Project Rubric (on the next page).
4. When you are satisfied with your project, submit it according to the Submission Instructions on the next page.
Expand Down Expand Up @@ -31,20 +29,67 @@ Each string has a title that describes how it should be used. For instance, `HTM
### Your process:
The resume has four distinct sections: work, education, projects and a header with biographical information. You’ll need to:

1. Build four JSONs, each one representing a different resume section.
* `work` contains an array of `jobs`. Each `job` object in `jobs` should contain an `employer`, `title`, `location`, `dates worked` and `description`.
* `projects` contains an array of `projects`. Each `project` object in `projects` should contain a `title`, `dates worked`, `description`, and an `images` array with URL strings for project images.
* `bio` contains a `name`, `role`, `welcomeMessage`, `contacts` object and `skills` array. The `contacts` object should contain (but doesn't have to) a `mobile number`, `email` address, `github` username, `twitter` handle and `location`.
* `education` contains an array of `schools`. Each `school` object in `schools` contains a `name`, `location`, `degree`, `majors` array, `dates attended` and a `url` for the school's website. `education` also contains an `onlineCourses` array. Each `onlineCourse` object in `onlineCourses` should contain a `title`, `school`, `dates attended` and a `url` for the course.
1. Build four JSONs, each one representing a different resume section, The objects that you create need to follow the names within the schema exactly:

* `bio` contains:

name : string
role : string
contacts : array of objects with
mobile: string
email: string
github: string
twitter: string
location: string
welcomeMessage: string
skills: array of strings
biopic: url
display: function

* `education` contains:

schools: array of objects with
name: string
location: string
degree: string
majors: array of strings
dates: integer (graduation date)
url: string
onlineCourses: array with
title: string
school: string
date: integer (date finished)
url: string
display: function

* `work` contains

jobs: array of objects with
employer: string
title: string
location: string
dates: string (works with a hyphen between them)
description: string
display: function

* `projects` contains:

projects: array of objects with
title: string
dates: string (works with a hyphen between them)
description: string
images: array with string urls
display: function

2. Iterate through each JSON and append its information to index.html in the correct section.
* First off, you’ll be using jQuery’s `selector.append()` and `selector.prepend()` functions to modify index.html. `selector.append()` makes an element appear at the end of a selected section. `selector.prepend()` makes an element appear at the beginning of a selected section.
* Pay close attention to the ids of the `<div>`s in index.html and the HTML snippets in helper.js. They’ll be very useful as jQuery selectors for `selector.append()` and `selector.prepend()`
* You’ll also be using the JavaScript method `string.replace(old, new)` to swap out all the placeholder text (e.g. `%data%`) for data from your resume JSONs.
* Here’s an example of some code that would add the location of one your companies to the page:
* `var formattedLocation = HTMLworkLocation.replace("%data%", work.jobs[job].location);`
* `$(".work-entry:last").append(formattedLocation);`
* Use the mockup at the bottom of this document as a guide for the order in which you should append elements to the page.
3. The resume includes an interactive map. To add it, append the googleMap string to `<div id=”map”>`.
* Use the mockup at the page of this document as a guide for the order in which you should append elements to the page.
3. The resume includes an interactive map. To add it, append the googleMap string to `<div id=”mapDiv”>`.
4. All of your code for adding elements to the resume should be within functions. And all of your functions should be encapsulated within the same objects containing your resume data. For instance, your functions for appending work experience elements to the page should be found within the same object containing data about your work experience.
5. Your resume should also `console.log()` information about click locations. On line 90 in helper.js, you’ll find a jQuery onclick handler that you’ll need to modify to work with the `logClicks(x,y)` function above it.
6. It’s possible to make additional information show up when you click on the pins in the map. Check out line 174 in helper.js and the Google Maps API to get started.
6. It’s possible to make additional information show up when you click on the pins in the map. Check out line 174 in helper.js and the Google Maps API to get started.

0 comments on commit 7ac037a

Please sign in to comment.