bostonhuman

boston-map-api

A single-page application featuring a map of my favorite places I would like to visit. By using Google Map API and Yelp API.

filter-tags.html

In this example, a gallery of images are tagged. Users click on filters to show matching images.

hogwarts-gallery

This is Hogwarts Gallery project.

js-accordion

When you click on the title of an accordion, its corresponding panel expands to reveal the content.

js-panel

When you click on one of the tabs, its corresponding panel is shown. Tabbed panels look a little like index cards.

mobile-portfolio

Optimize the critical rendering path and make this page render as quickly as possible.

blur-focus

This example, as the text input gains and loses focus, feedback is shown to the user in the div element under the text input. The feedback is given using two functions.

copy-javascript

In this example, you can see parts of the DOM tree being removed, duplicated, and placed elsewhere on the page.

focus-blur-edit

This example, as the text input gains and loses focus, feedback is shown to the user in the div element under the text input. The feedback is given using two functions.

form-edit

In this example, a button and form have been added under the list. When the user clicks on the button to add a new item, the form will come into view.

form-javascript

In this example, a button and form have been added under the list. When the user clicks on the button to add a new item, the form will come into view.

istlsfastyet.com

Is TLS fast yet? Yes, yes it is.

javascript-form-edit

In this example, a button and form have been added under the list. When the user clicks on the button to add a new item, the form will come into view.

javascript-load-edit

The load event is commonly used to trigger scripts that access the contents of the page. In this example, a function called setup() gives focus to the text input when the page has loaded.

js-filter

The array object has two methods that are very useful for filtering data.

js-modal

A modal window is any type of content that appears "in front of" the rest of the pages's content. It must be "closed" before the rest of the page can be interacted with.

js-slider

A slider positions a series of items next to each other, but only shows one at a time. The images then slide from one to the next.

js-viewer

The photo viewer is an example of an images gallery. When you click on a thumbnail, the main photograph is replaced with a new image.

ladygaga

This is a responsive website for all browsers and smartphones.

load-javascript

The load event is commonly used to trigger scripts that access the contents of the page. In this example, a function called setup() gives focus to the text input when the page has loaded.

movie-trailer

mywebsite

This is my website.

photo-gallery

In this project, we develop a photo gallery page.

position-javascript

In this example, as the user scrolls down the page, a box slides into view if they get within 500 pixels of the footer.

tree-project1

This is tech degree project 1. This is called Personal Profile Page.

tree-project2

This is tech degree project 2. It is a responsive website.

tree-project3

This is tech degree project 3. This is called Form Registration Page. This form allows developer to collect informations from visitors.

tree-project4

This is tech degree project 4. This is called Photo Gallery Page. This is included with jQuery plugin.

tree-project5

This is tech degree project 5. CSS to Sass.

tree-project6

In this project, a website with rasterized images (PNG files) along with matching SVG files. I'll need to replace the rasterized images and modernize the UI using the SVGs.