Posts related to: 'Tutorials'

Display Temperature Averages with JavaScript Functional Programming

Use JavaScript functional programming to display average temperatures in certain cities. Uses the .map() & .reduce() methods. Includes demo.

Setup Link Functionality with Functional Programming

Use JavaScript functional programming to set click-to-link functionality on a set of elements. Code sample has a basic webpack/Babel setup.

Click to Tweet Link Created Dynamically With JS

Tutorial for dynamically creating a click to Tweet link with JavaScript and the window.location object…no hard-coding. With demos and code samples.

TUTORIAL: Filter Content With jQuery.filter() & jQuery Selectors

Use jQuery.filter() & Attribute Selectors with HTML5 data attributes to filter out specific content on a click. Includes a code demo.

TUTORIAL: Load data attributes with Mouse Clicks

Use mouse clicks to load information stored in data attributes onto a web page in a cross-browser compatible way. Contains lots of demos.

TUTORIAL: Jekyll Search with Non-JavaScript/CSS Fallback

jQuery-powered search functionality for a Jekyll site with fallback code if JS or CSS is disabled. Look at the demo before using the code.

TUTORIAL: Remove Files From GitHub

Get quick answers first, then learn how Git works with GitHub. This post also has an excellent list of Git/GitHub learning links at the end.

SCREENCAST TUTORIAL: Using JavaScript Off-DOM

How to create/change page elements off-DOM with JavaScript. Discusses createDocumentFragment, cloneNode, appendChild, jQuery .attr() & more.

TUTORIAL: What NYC Subways Can Teach Us About JavaScript Closures

JavaScript closures tutorial using the New York City subway to explain how they work. With demo, code samples and short reading list.

SCREENCAST TUTORIAL: JavaScript for() loop That Creates A jQuery Fade In/Fade Out

JavaScript for loop dynamically creates a jQuery fade in/fade out effect with a delay; includes a demo, code sample and screencast tutorial.

TUTORIAL: Creating A Rounded Corner, Transparent CSS3 Link For IE 6 Through 8 With CSS3 Pie

A tutorial on creating a rounded corner, transparent CSS3 link in Internet Explorer 6 through 8 with CSS3 PIE

TUTORIAL: A Simple, Effective jQuery Image Rollover

A very popular, cross-browser complaint jQuery image rollover

TUTORIAL: A Simple jQuery Image Fade In/Fade Out With A Delay

An easy jQuery tutorial to fade in and fade out two images with a delay

TUTORIAL: How AJAX, jQuery and HTML5 Work Together

AJAX, jQuery and HTML5 are big buzz words in the web design/development community nowadays. While getting these web technologies to work together is exciting, the programming required to do this isn’t new.

TUTORIAL: Create The Building Blocks For An HTML5 Page

Understanding the HTML5 DTD and Character Set Needed For Your First HTML5 Page.


Posts related to: 'Coding Tips'

JavaScript Developers...Stop HATING Frameworks!!!

JavaScript developers can avoid using frameworks and libraries if the have to, but too many developers avoid them for the wrong reasons.

Use .filter() Instead of an Inner Loop in My JS Average Temperature Code

kaidez updates his JavaScript functional programming/average temperature post to use .filter() instead of an inner loop. Includes demo.

Format Dates with Functional Programming

Use JavaScript functional programming to format dates with the Date() object. Includes a React example.

Want to Learn Javascript Unit Testing? Learn Functional Programming First!

Learn JavaScript unit testing by creating smaller functions with functional programming & testing them with QUnit. Lots of learning resources links.

jQuery: It’s OK To Use It

jQuery allows for too much productivity for web developers to stop using it completely. But they should understand when to use it, and why.

Babel Setup For Beginners

How I set up Babel, Browserify, Babelify & Babel ES2015 presets for web development. Great for Babel beginners. Contains lots of resource links.

The “Head First” Duck Simulator In Typescript

TypeScript recreates the Duck Simulator/Strategy pattern described in the "Head First Design Patterns" book. With lots of resource links.

SCREENCAST: Build Tasks With “npm run”

Watch how I use “npm run” to run HTML, CSS and JavaScript build tasks. An alternative to using Grunt, Gulp and similar tools.

SCREENCAST: CSS Build Demo

A demo of how to optimize CSS with Gulp, Grunt and tasks like uncss and critical path css. Has a link to fully-commented code on GitHub.

kdz - My Personal Scaffolding Tool

kaidez used Node to create a tool for scaffolding out web development projects. Includes a link to thoroughly commented code on GitHub.

Web Components Demo: Templates and (some) Shadow DOM

A Web Components demo using just templates and Shadow DOM, mostly templates. Post includes many links to Web Component learning resources.

Using RequireJS In WordPress

Learn how to use RequireJS in WordPress. Includes a walk-through of how RequireJS works and how WordPress manages JavaScript internally.

Media Queries Are Important

CSS3 media queries can help sites perform better in Google search results and the W3C officially recommends them as a web standard.

5 Reasons Why You Need To Learn To Use JavaScript Before jQuery

A list of good reasons why it’s better to learn JavaScript before jQuery. A short learning resource list at the end to help you get started.

A Simple Explanation of HTML5

A lengthy but simple explanation of what HTML5 is with suggestions on how business can use it. Very little technical language is used.

5 Mobile Web Development Best Practice Resources

Great mobile web development best practice resource list-includes site speed gurus, blogs & a podcast featuring jQuery creator, John Resig.

2 Bad Things About the Facebook App Setup

Creating a Facebook app is easy but doing so generates CSS expressions and creates page reflows, all of which reduce page optimization

Mobile Web Development Best Practices – Starting Tips

Starter mobile web development best practices including YSlow & Page Speed tests and minifying pages with HTML5 Boilerplate’s build script

New York Times Article On HTML5: Their New HTML5 Site

A great New York Times piece on HTML5 application development and a demo of their new HTML5 Skimmer site

HTML5 Boilerplate Goes To Version 1.0

A quick review of HTML5 Boilerplate version 1.0, discussing the new build script for site optimization and custom site template build

HTML5 Project Update: Changing To A Responsive Web Design Using CSS3 Media Queries

An article on responsive web design, CSS3 media queries and using it in kaidez’s HTML5 Project, resource list of links at the end

Easy-To-Read Version of The HTML5 Specification

Ben Schwarz gives us HTML5-A technical specification for Web developers, translating WHATWG’s HTML5 arduous spec into layman’s terms

HTML5 Project: Boilerplate WordPress Theme

Walk-through of Aaron T. Grogg’s excellent HTML5 Boilerplate-based WordPress theme. Includes a great admin screen for custom configuration.

Yoast's Awesome WordPress SEO Speech

A quick review of a great WordPress SEO speech from Joost de Valk, AKA Yoast, with the video embedded on the page for instant viewing

The HTML5 Boilerplate Video is AWESOME!!!!!!

Paul Irish’s HTML5 Boilerplate video is extremely informative as it demonstrates many great CSS and JavaScript hacks and best practices

HTML5 Readiness - NEW COOLSITE!

HTML5 Readiness neatly displays browser support for HTML5 and CSS3

Update to My HTML5/SEO/Microdata Post

Oli Studholme from HTML5 Doctor corrects my previous post on HTML5, SEO and microdata

WordPress & WebMatrix

Using WebMatrix to create a WordPress development site

HTML5, SEO and Microdata

HTML5’s Microdata feature is a good tactic if properly formatted

Great Video Lecture on WordPress Usability & Analytics

Stefanos Kofopoulos from pestaola.gr shares some excellent usability & analytics tips that he applied to his Wordpress-based blog.

10 Things To Remember About HTML5 Video

HTML5 Video Tips from kaidez

Two JavaScript Tasks That jQuery Does Not Replace

Short article about how jQuery does not have a replacement for JavaScript’s document.write and has a not-so-great replacement for its navigator.UserAgent

5 Reasons To Design Websites For Internet Explorer 6

HTML5 Gallery, mostly maintained by the HTML5 expert over at HTML5 Doctor, is added to kaidez.com’s Coolsite list

10 WordPress Tips For Web Designers

10 great tips that can help you with WordPress development, such as creating child themes, page templates and how to approach security.

My HTML5 Applications

I’m starting to narrow down what my favorite HTML5 tools are.

2 HTML5 Resources I Like

Great HTML5 learning resources


Posts related to: 'Personal'

Search Autocomplete Thing I Did

Quick thoughts on building a small search autocomplete tool. What I learned, what I liked and what I didn’t like.

What I Learned About Finding A Front End Web Developer Job In 2022

Six things I learned when looking for a front end web developer job in 2022. Also lists the top FE web dev skills employers are looking for.

kaidez 2017 site redesign

Kai takes a simplistic approach to updating his blog, using Jekyll, GitHub Pages, BEM CSS, a little bit of React, webpack and Yarn.

The State of JavaScript

React/Redux are part of JavaScript’s progression to a full application language. Study this progression to prepare yourself for the future.

What I Learned About Finding A Front End Web Developer Job In 2017-UPDATED

Random notes on my past & present experiences in looking for a front end web developer job in 2017. Has tips for code bootcamp graduates looking for work.

Click To Tweet Tutorial Update

kaidez’s click to Tweet tutorial is updated to be shorter, more readable, provide information faster & demonstrate some window.location JavaScript tricks.

10 Tips for High School Students Wanting to be Web designers/Developers-2016 edition

Tips for high schoolers wanting to be web designers/developers while looking at the state of technology education and hiring in 2016.

kaidez 2015 site redesign

kaidez.com uses underscores to create a custom Swiss-style Wordpress theme for his blog’s new design. webpack and gulp manage the JS/CSS build process.

Write Code Every F–king Day!

The best way to learn web development is to try and write at least one piece of code a day, especially if the code is JavaScript.

Goodbye, Revlon

After almost ten years, I’m leaving Revlon to pursue a exciting new opportunity.

New Site I Worked On: parlorhairstudio.com

kaidez created a WordPress site for a Montclair, NJ hair salon, with a strong focus on optimizing the site for local SEO.

AJAX Tutorial Update

kaidez’s old AJAX tutorial was updated. jQuery AJAX is discussed in depth and there’s a short discussion on JavaScript Promises.

New Site I Worked On: RevlonProBrands.com

kaidez developed the RevlonProBrands.com site using GitHub Atom, Jade, OOCSS, Modernizr’s yepnope functionality, Gulp & Grunt.

GitHub Tutorial Update

kaidez’s Git/GitHub tutorial is updated to be shorter, provide information faster and by providing 2 new links to the learning resource list

kaidez 2013 Site Redesign

kaidez.com uses Jekyll as a blog engine, Grunt as a task runner, RequireJS for modular JavaScript management, & Bower for package management

Where I've Been...Upcoming Site Update

A quick update about the status of kaidez.com, including the announcing of a new, upcoming site design.

The kaidez JavaScript Conference Tour: Leg 1: Fluent 2012/San Francisco

Kai discusses what courses and sessions he’ll be checking out at the 2012 Fluent JavaScript Conference. Node, and Jasmine are a few of them.

Remembering Steve Jobs

kaidez recalls the best about Steve Jobs

New Almay Facebook Page I Worked On

kaidez developed Almay’s Facebook What’s New page following some best practices in terms of mobile web development.

New Mitchum Project I Worked On

The new Mitchum site was developed with HTML5 using HTML5 Boilerplate, Visual Studio 2010 with NuGet, CSS and some light jQuery

My 50th Article – A Retrospective!

kaidez reviews his progress with learning web development and how his blog is doing in terms of content, SEO and social network promotion

Off I Go To MIX11/Las Vegas!

A list of front-end web development courses that kaidez will take at MIX11 2011 and brief explanations of some other courses available

10 Tips For High Schoolers Wanting To Be Web Designers Or Developers

An extensive article with tips, resources and ideas for high school students wanting to work in the web design or development field someday

Im Going To Mix11/Las Vegas!

Kai Gittens, (kaidez) will be at Microsoft’s Mix11 Conference in Las Vegas in April 2011 and will be at the HTML5/CSS3 and jQuery bootcamps

HTML5 Project: WIREFRAME SERIES #3 – ABOUT & CONTACT PAGES

Final article in the HTML5 wireframe series for the kaidez portfolio site

HTML5 Project: WIREFRAME SERIES #2 – WORK & NIKO‘S PLAYLIST PAGES

Part Two of my explanation on how I created wireframed my HTML5 site before I developed and designed it

HTML5 Project: WIREFRAME SERIES #1 – HOME PAGE

Wireframes for the kaidez portfolio site of New York/Jersey City, N.J. based web designer, Kai Gittens, who also works at Revlon and Almay

HTML5 Project: WIREFRAME SERIES – INTRO

HTML5 wireframe preview of kaidez.com portfolio site

Updates To Coolsites and HTML5/jQuery Resources

Additions to my list of resources to help you learn web design and development and my Coolsites list, including a Sitecore and .NET development blog

My Study Schedule As Of January 26, 2011

How I plan to study HTML5, CSS3 and .NET

HTML5 Project Update: 1/21/11

My HTML5 Project will use HTML5, CSS3, jQuery, Modernizr, maybe CSS PIE, and will be a portfolio of my work and experiments.

Read My Article At Inspired Magazine!!!

Kaidez guest post at Inspired Magazine responded to Cameron Chapman’s web designer article at Smashing Magazine

New Almay Project I Worked On

Kaidez developed four micro-sites for Almay using HTML5 video, jQuery, .NET and CSS

jQuery T-shirt – Geek Gift To Myself

My cool jQuery t-shirt

CNN calls the do not track option a "Google killer"

Quick recap of CNN’s article on the FTC’s proposal of adding a do not track feature that consumers can use for internet browsing, short opinion included

I'm Focusing On .NET C#

kaidez lays out a plan on how he’ll learn .NET/C#.

A Short History of Flash (how I saw it)

kaidez’s view of Flash’s evolution, rise and (somewhat) fall.

Welcome Back!!!!!!!!

kaidez.com is no longer a blog that focuses on soccer/footie…it now focuses on web development.


Posts related to: 'Reviews'

REVIEW: Effective JavaScript

Excellent book that explains complicated JavaScript concepts like API design in painstaking clarity. Great for intermediate JS developers.

REVIEW: Downloaded

The Napster documentary recaps the company’s story and the atmosphere it created, but it doesn’t tell the whole story.

REVIEW: Eloquent JavaScript

Great JavaScript book for beginners covering the fundamentals in detail, focusing on how to use them in web applications, not just websites.

5 Useful JavaScript Books

Great, useful JavaScript books listed from easiest to hardest. Authors include John Resig, Douglas Crockford and Stoyan Stefanov.

REVIEW: HTML5 Games Development by Example: Beginner’s Guide

Great book for learning HTML5 games development as well as web development best practices. Discusses offline storage, Canvas, node.js & more!

REVIEW: jQuery: Visual Quickstart Guide

A negative review of Peachpit Press’ jQuery: Visual Quickstart Guide, but it doesn’t take away from the fact that the VQS Series is great

HTML5 Recent Article Roundup

A list of great HTML5 articles compiled by kaidez

Social Media Week Follow-Up & A Word From Panelist Kristin Volk

Kristin Volk of MediaVest added some extra information to my recap of the Cross-Mobile Promotion panel at the 2011 NYC Social Media Week

Social Media Week/NYC Recap – MOBILE PROMOTION PANEL

The cross mobile promotion panel at NY Social Media Week used Nielsen and comScore stats to show how brands use mobile to promote products

Social Media Week/NYC Recap – SOCIAL LISTENING PANEL

The social listening panel at NYC Social Media Week showed how companies like Pepsi track their products within the social networks

REVIEW: Pro HTML5 Programming

A review of the Pro HTML5 Programming by Apress

HTML5 Gallery: NEW COOLSITE!

HTML5 Gallery, mostly maintained by the HTML5 expert over at HTML5 Doctor, is added to kaidez.com’s Coolsite list

The Two Best Books On The Dot-com Rush

Michael Lewis and Joseph Menn wrote to great books on the Dot-com Rush.

REVIEW: lynda.com

A mostly positive review of lynda.com and its courses, front-end development and PhotoShop are discussed.


Coding Tips

Affiliate Disclaimer

Articles

Sitemap

kaidez courses on lynda.com

AJAX Tutorial for Beginners

Personal

Reviews

Tutorials

Blog