Here are some of my recent projects
I built this using the Devise Gem for the Authorization and Authentication features.
I used the Paperclip Gem and Amazon’s Hosting to store the images.
Everyone can see the superhero names and images, but only members can see the superhero secrets.
Become a member by Signing Up.
Members can edit and delete only their own secrets.
I built this using the Owl Carousel Gem. It is responsive to Touch Screens.
I built this using JQuery. There is even a random colors option.
I built this using a combination of the Simple Form and Mail Form Gems. I am able to receive secure messages via SendGrid.
I built this using JavaScript. Click on the checkboxes to find out how stressed your life has been.
Start and Pause the Changing Background Color
I built this using JQuery. You can start and pause the continuous changing of the webpage’s background color.
Enter your age, initial contribution, and the interest rate you expect to learn. Find out how much your money will be worth when you retire thanks to compound interest.
Each time you load the page, a random set of eyes will follow your every mouse movement. Built with JQuery and JavaScript.
This calculator performs operations in real-time. I used AJAX (Asynchronous JavaScript and XML) to allow the calculations to occur and be displayed without having to reload the page.
I’m not exactly sure what I built or why I built this 🙂 In any event, the image rotates and pauses rotation when you press the Start/Pause button. The JQuery Rotate library was used for this effect.
This is a simple tip calculator that uses JavaScript to perform the calculation. There are validations to ensure that the only positive numbers are accepted.
Can you guess what the mystery movie is?
I built this using the JQuery UI which provides the Accordion User Interface. The hints are comprised of images and an audio clip.
See how much you can get done in 25 minutes of focused effort. This timer has a start and reset as well as a pause and resume.
This is a silly and fun application of JQuery and JavaScript event handlers. Click on the cloud and make it rain, except metaphorically 😉
These are like Post It Notes, but you don’t have to worry about them falling off. This was built with Ruby on Rails and lots of CSS Styling, plus a personalized (aka horrible) button design by myself.
Since cats own the internet, I let them take over one of my pages. These are JQuery rotations and animations and many event handlers.
Enter a city and find out its current temperature. This was made using the Open Weather Map API which provided data in the JSON format.
This displays the panoramic view of a pot and a Koopa Troopa by using JQuery Reel. See for yourself by clicking on an image or by clicking on an image and then moving the mouse to the right.
This shows a scrambled word and then checks to see if your guess matches the correct answer. JavaScript and JQuery functions were used along with Regular Expressions to allow empty spaces in the guesses.
This was inspired by Benjamin Franklin’s technique for making decisions. To help you decide, type in the situation in the top box and then add the pros and cons in the boxes below. Finally clear away your worries by pressing the Clear Everything button. This was built with JavaScript and JQuery.
This idea came from Free Code Camp’s Random Quote Generator. I have added a random image in addition to the random quote. Furthermore, neither the same image nor the same quote will appear twice in a row.
This idea came from Codecademy’s Website Project. This was done exclusively with HTML and CSS. It was great a learning experience to get back to the basics, however, I am more than happy to return to using Twitter Bootstrap and Sass.
Enter an ingredient and get recipes and nutritional information instantly. This was made using the Edamam’s Recipe Search and Diet APIwhich provides access to over 1.5 million recipes from over 500 sites.
Find the difference between two dates or find a date in the future by entering a number. Built with JQuery UI.
This used HTML Canvas with JavaScript and was based on this tutorial. This site shows how a project can unify physics, JQuery, HTML animation, mouse listeners, and much more.
This site used the Pomodoro Timer as a starting point.
This page lets you determine the duration of meditation, how often to hear reminder bells, and even lets you pause and resume your meditation.
This site is a simple explanation with demonstrations of JavaScript Closures. For more information and helpful links, visit my blog entry
This clock displays the time and city. This site uses the Telize API to ascertain the current city by the IP Address and JavaScript functions to detect and display the browser’s current time.
This displays a few of my projects using The Owl Carousel Gem. The carousel responds to touch navigation and the images are links to the sites.
These are flash cards built using Ruby on Rails with the JQuery UI Accordion. This site uses Active Record to manage the logic and the data.
Are you ready for your first programming job?
Take this (somewhat satirical) survey and find out if you are ready for your first developer job. Built with JQuery and JavaScript, it is similar to my Holmes and Rahe stress scale but built even more efficiently and effectively.
This is an introduction to The Sedona Method which is a set of simple questions designed to release stress. Built with JQuery and JavaScript with a few well-thought out loops, if-else statements, and conditional logic constructs.
This site used HTML Canvas with JavaScript and was based on this guide. I added more balloon colors, a pop up message when the last balloon has been popped, and the ability to add more balloons.
This site uses the Yandex API for translation. JavaScript functions allow translations to occur without a page reload.
This was just me playing around with some drawings and animations using HTML5’s Canvas in conjunction with JavaScript functions.
This used Ruby on Rails along with Amazon Web Services to store images of likable pets. The Paperclip Gem was used to attach the images while AJAX was used to track the number of likes.
This was built with JQuery UI Tabs. These are my reflections on my building, blogging, and learning.
Tip Calculator and Bill Splitter
This is my first AngularJS Site. It is a real-time tip calculator with bill splitting capability.
In honor of Labor Day, I recreated this folk song with JQuery and JavaScript.
This used AngularJS and was based on this tutorial. This site demonstrates AngularJS features such as controllers, scopes, and bindings.
This idea came from The Odin Project. It is JavaScript and JQuery DOM manipulation with colorful results.
This site used HTML, CSS, and Bootstrap. It was the first step towards emulating this site.
Pomodoro Timer with Improved Styling
This site used the same JavaScript and JQuery code as this previous site. I used Bootstrap to imitate elements of this superb Pomodoro Timer.
This used Bootstrap and was based on this video. This site demonstrates Bootstrap features such grid layouts, responsive design, and Scrollspy.
This used Bootstrap and was based on this page. This site used nested grid layouts and responsive design.
This used Bootstrap and was based on this video. This site demonstrates Bootstrap features such panels, navs, and responsive design.
This site used HTML, CSS, and Bootstrap. It was an emulation of elements from this this site.
This used Bootstrap and was based on this course. This site demonstrates Bootstrap features such Contextual Classes, Responsive Embed, and Badges.
This used Bootstrap and was based on this course. This site demonstrates Bootstrap features such Navbars, Dropdown Menus, and Forms.
This site used HTML, CSS, and Bootstrap. It was another step towards emulating this site. The first step can be found here.
This site used HTML, CSS, and Bootstrap. It was an emulation of elements from this image.
This site used HTML, CSS, and Bootstrap. It was an emulation of elements from this this site.
This used Bootstrap and was based on this Bootstrap 2.0 tutorial. This site demonstrates Bootstrap features such Glyphicons, Grid Layouts, and Collapsible Nav Bars.
This site used JQuery Lightbox to overlay images on top of the current page. See for yourself by clicking on an image.
This site used HTML Canvas with JavaScript and was based on this walkthrough. For more information about what the fireworks represent, visit my blog entry .
This site used HTML, CSS, and Bootstrap. It was an emulation of elements from this Bootstrap 2 site.
This site used HTML, CSS, and Bootstrap. It was an emulation of elements from this Bootstrap site.
This used Bootstrap and was based on this UX advice. This site demonstrated the importance of giving the user a clear path when he or she is lost.
This site used Bootstrap and was based on this lesson. This landing page demonstrated the power of a simple User Interface combined with questions that lead logically and emotionally to a Call to Action (signup and button click).
This site used the JQuery Quicksand Plugin and was based on this demonstration.
This site used JQuery Tubular to play the Turtles “Happy Together” in the background.
This site used JQuery to create a filterable portfolio and was based on this layout.
This used AngularJS and was based on this video. This site demonstrates AngularJS features such as controllers, directives, and forms.
This site used HTML, CSS, and Bootstrap. It was an emulation of elements from this layout.
This site was based on this walkthrough. This site demonstrated that CSS, media queries, and JQuery can achieve a responsive design.
This site used JavaScript, JQuery, and Bootstrap. My goal is to rebuild this site in the future but with AngularJS instead of JQuery…
This used AngularJS and was based on this introduction. This site demonstrates AngularJS features such as controllers, filters, and modules.
This site used Bootstrap and was based on this template. This landing page shows what I do for fun outside of coding.
This used AngularJS and was based on this example. This site demonstrates AngularJS features such as scopes, directives, and two-way binding.
This site used HTML, CSS, and Bootstrap. It was an emulation of elements from this layout.
AngularJS Retirement Calculator
This site is an improved version of the Compound Interest Calculator because it performs the calculations instantly.
This site is a basic Countdown Timer with Resume and Stop functionality.
This site used AngularJS directives including ng-click to display quotes. JavaScript was used to select random array properties.
AngularJS Retirement Calculator 2
This site is an improved version of the Compound Interest Calculator because it displays the yearly earnings and total earnings instantly.
This used AngularJS and was based on this documentation. This site demonstrates AngularJS features such as Dependency Injection, Factory Functions, and Controllers.
This site used HTML, CSS, and Bootstrap. It is an upgrade from this portfolio site because it uses JQuery to categorize the websites.
This site has demonstrations of a few common String Interview Questions solved with JavaScript.
This used AngularJS and was based on this example. This site demonstrates AngularJS features such as Route Service, Templates, and Controllers.
This was built with JQuery Easing and was based on this tutorial. This animation provides a link to my lessons learned from 75 days of building sites.
This used AngularJS and was based on this walkthrough. This site demonstrates AngularJS features such as Routes, Templates, and Controllers.
This used AngularJS and was based on this in-depth explanation. This site demonstrates AngularJS features such as Routing, Templates, and Views.
This used AngularJS and was based on this Stack Overflow post. This site demonstrates AngularJS features such as Intervals, Promises, and Services.
This site has a walkthrough of an array Interview Question solved with JavaScript.
This used AngularJS to sort The Legend of Korra characters by their bending abilities. This site demonstrates AngularJS features such as JSON, Factories, and Routes.
This used AngularJS and was based on this tutorial. This site demonstrates AngularJS features such as Filters, Ordering, and Services.
This used AngularJS and was based on this summary. This site demonstrates AngularJS features such as ng-repeat, Formatting, and Filtering.
This used AngularJS and was based on this Stack Overflow question. This site demonstrates AngularJS features such as Bootstrap Collapse, Directives, and Templates.
This used AngularJS and was based on this tutorial. This site demonstrates AngularJS features such as Filters, JSON, and Controllers.
This used AngularJS and was based on this excellent walkthrough. This site demonstrates AngularJS features such as APIs, Templates, and Directives.
This used AngularJS and was based on this guide. This site demonstrates AngularJS features such as ng-watch, Scopes, and Listeners.
This used AngularJS and was based on this video introduction. This site demonstrates AngularJS features such as Directives, Templates, and Scopes.
This used AngularJS and was based on this tutorial. This site demonstrates AngularJS features such as Directives, Factories, and Modules.
This used AngularJS and was based on this post. This site demonstrates AngularJS features such as Repeat, Show, and Animate.
bryanttunbutr 