Get $1 credit for every $25 spent!

Ultimate Web Design & UX Bundle

Ending In:
$780
95% off
add to waitlist
Courses
10
Lessons
292
Enrolled
392

What's Included

Product Details

Access
Lifetime
Content
1.25 hours
Lessons
14

Learning Git

Streamline, Organize & Energize Your Development Projects with This Popular Version Control System

By Packt Publishing | in Online Courses

Bump your development skills up a notch by mastering Git. This distributed version control system allows you to batch track the history of your file edits, and to identify when and where your code has changed. You'll learn how to initialize your first repository, manage your commit history, and more, gaining the tools you need to quickly and efficiently handle any development project.

  • Access 14 lectures & 1.25 hours of content 24/7
  • Create a Git repository to start tracking versions of your projects
  • Contribute to different projects by making commits to Git repositories
  • Secure your repository with the help of SSH keys
  • Work with multiple people on a project using Branch and Merge commands
  • Link to the online remote copies of a repository & stay updated w/ the changes
  • Add tags to mark the deployed versions of the project
  • Resolve the bugs by tracing code changes to its origin
Packt’s mission is to help the world put software to work in new ways, through the delivery of effective learning and information services to IT professionals. Working towards that vision, it has published over 3,000 books and videos so far, providing IT professionals with the actionable knowledge they need to get the job done–whether that’s specific learning on an emerging technology or optimizing key skills in more established tools.

Details & Requirements

  • Length of time users can access this course: lifetime access
  • Access options: web streaming, mobile streaming
  • Certification of completion not included
  • Redemption deadline: redeem your code within 30 days of purchase
  • Experience level required: all levels

Course Outline

  • Git – Quick Start
    • The Course Overview
    • Git Version Control
    • Choosing a Workflow
  • Building Your First Repository
    • Initialization
    • The First Commit
    • Managing the Remotes
    • Viewing the History
  • Working in a Team
    • Branching and Forking
    • Synchronizing
    • Issuing Pull Requests
  • Advanced Features
    • Interactive Rebasing
    • Tagging a Release
    • Tracing Code
    • Where to Go Next?

View Full Curriculum


Access
Lifetime
Content
4 hours
Lessons
38

UX Design for Web Developers

Create Crisper, Cleaner User Experiences

By Packt Publishing | in Online Courses

User experience (UX) design refers to a theoretical understanding of how users interact with websites. One of the greatest challenges any website faces is finding the right balance between fulfilling its stated objective, while also meeting the needs of its users. Because this challenge is so great, UX designers are a hot commodity, and this course will teach you all the best practices to join that company of in-demand designers.

  • Access 38 lectures & 4 hours of content 24/7
  • Explore fundamental principles & practical approaches like wireframing, bootstrapping & more
  • Understand how UX fits in the business & web development worlds
  • Learn best practices of UX design & start building your own application
  • Set up wireframes & fix the loophole of static application using the Invision tool
Chris R Becker is an imaginative and creative interaction designer / UX designer / Design researcher and educator. A conceptual thinker, he has the ability to design across media platforms for solutions within experience design, interaction, information architecture, business and brand strategy, web and app design, advertising, systems design, and print. He is organized and passionate for following design problems from concept to finished product. He is also well versed in prototyping, design research, human-centered design methodologies, and user testing for taking ideas from the drawing board to the real world. He is competent in pre-press and production and is not afraid to get his hands dirty, with a strong communication background through positions in versed industries.

Chris teaches at the Loyola Marymount University, UCLA – Extension & Art Center College of Design. His clients include Vitasigns, Apple, Beats by Dre, Nissan, VW, STEAM Carnival, fanswell.fm, Theranos, CB2, Men's Wearhouse, Hyundai, Toyota, and more.

Details & Requirements

  • Length of time users can access this course: lifetime access
  • Access options: web streaming, mobile streaming
  • Certification of completion not included
  • Redemption deadline: redeem your code within 30 days of purchase
  • Experience level required: all levels

Course Outline

  • What Makes a Great User Experience?
    • The Course Overview (2:08)
    • UX Design Fundamentals (7:41)
    • Fundamentals of Building a Website (12:46)
  • Applying Human-centered Design
    • Essentials of Human-centered Design (3:12)
    • Empathy Mapping (7:48)
    • Intervention Planning (11:19)
  • Enhancing Site Navigation and Laying Out Our Site
    • Understanding the Need for Structure (2:23)
    • Structure and Information Architecture (5:33)
    • The Essential Elements (4:46)
    • Design Patterns – Don't Reinvent the Wheel (4:42)
    • SERPS as Home Pages and Location-free Browsing (5:36)
    • Landing Pages, Templates, and Page Clustering (6:47)
  • Wireframing 1 – Using Responsive Web Design
    • Responsive Web Design (3:06)
    • Wireframing (4:53)
    • Building Your Setup (3:18)
  • Designing the Home Page
    • Home Page Wireframes (2:23)
    • Envisioning an Information Ecosystem (6:06)
    • Formatting Pages and Content Chunking (4:25)
    • Creating Interactions (6:40)
  • Using Media
    • Media Types (4:58)
    • Media Annoyances (5:54)
    • Using Graphics (5:18)
  • Best Practices and Usability
    • Discuss Best Practices in UX Design (5:44)
    • Mobile Best Practices (4:41)
    • Desktop Best Practices (3:54)
    • Usability (6:11)
    • Applying Usability to the Home Page (4:26)
  • Wireframing 2.0
    • Wireframe Your Mobile Screen (8:49)
    • Wireframe Your Tablet Screen (6:45)
    • Wireframe Your Desktop Screen (7:23)
  • Prototyping – Clickable Wireframes
    • Wireframe Setup for Prototyping (4:22)
    • Flushing Out Your Wireframes (4:30)
    • Connecting and Building Your Clickable Prototype (10:03)
  • The LEAN UX Prototype User Testing and Iteration Process
    • LEAN User Testing (5:11)
    • Test Your Prototype (3:44)
    • Validate and Iterate Your Prototype (6:30)
    • UX Course Review (5:12)

View Full Curriculum


Access
Lifetime
Content
4 hours
Lessons
40

Learning CSS

Create Stunning Websites with CSS

By Packt Publishing | in Online Courses

CSS3 is a critical programming language to learn if you want your websites to have fluid, functional designs. CSS allows you to add excitement to HTML elements by adding color, manipulating layouts, size, and position, enhancing visual objects, and much more. If you want your website to stand out from the pack, you're going to want to take this course.
  • Access 40 lectures & 4 hours of content 24/7
  • Learn about styles, rules & inspecting HTML elements
  • Investigate HTML selection using classes, IDs & elements
  • Use colors to bring out the flair in a website
  • Understand CSS selectors & manipulating the size & position of objects & layouts on the page
  • Tweak a layout so a web page works on all digital devices
  • Discover techniques for text & content manipulation
Ben Fhala discovered his passion for data visualization while he was working at Parsons in New York, in their data visualization department, PIIM. He is the owner of the online video training school, 02geek.com, and an Adobe ACP. He enjoys spending most of his time learning and teaching, and has a love for visual programming and visualization in general. Ben has had the honor of developing applications for members of the US Congress, Prime Ministers, and Presidents around the world.

He has built many interactive experiences for companies such as Target, AT&T, Crayola, Marriott, Neutrogena, and Nokia. He has technically directed many award-winning projects and has been part of teams that have won three Agency of the Year awards.

Among Ben's publications are HTML5 Graphing and Data Visualization Cookbook, and five video courses: jQuery UI Development; Learning Object-Oriented JavaScript; Mastering JavaScript; JavaScript Design Patterns; Web Visualization with HTML5, CSS3, and JavaScript, all for Packt Publishing.

Details & Requirements

  • Length of time users can access this course: lifetime access
  • Access options: web streaming, mobile streaming
  • Certification of completion not included
  • Redemption deadline: redeem your code within 30 days of purchase
  • Experience level required: all levels

Compatibility

  • Internet required

Course Outline

  • Defining Our First CSS Rules
    • The Course Overview (3:36)
    • Getting to Know Our Project (2:47)
    • Setting Our First Style (4:48)
    • Adding Multiple Rules to an Element
    • Converting Our Style into a Rule (3:14)
    • Moving Our CSS Logic into a Separate File (4:06)
    • Inspecting Any CSS on the Fly (4:17)
  • Playing with CSS Selectors
    • Taking a Deeper Look into the CSS Selector Rule (4:59)
    • Introducing CSS Classes (3:36)
    • Talking to HTML Items with IDs (4:45)
    • Traveling Through a Document with CSS Rules (3:25)
    • Defining a Few Items at the Same Time (2:26)
    • Best Practices When It Comes to CSS Rules (5:22)
  • Bumping It Up With Colors
    • Defining Backgrounds (12:51)
    • Working with the Background Property
    • Understanding How Colors Work in CSS (7:20)
    • Working with Advanced Color Systems (12:31)
  • Controlling Elements
    • Defining Opacity Levels (6:41)
    • Adding Outlines to Shapes (5:41)
    • Sticking to Our Borders (4:01)
    • Talking to One Line at a Time (4:19)
  • Manipulating Sizes
    • Controlling the Width and Height of Elements (8:29)
    • Defining Margins of HTML Elements (6:50)
    • Sizing Things in Different Ways (7:05)
    • Working with Padding (3:34)
  • Element Layout Interaction
    • Making Things Float (3:31)
    • Displaying Elements as Block or Inline Elements (8:25)
    • Avoiding Scrolls (5:02)
    • Types of Position Layout (6:03)
  • Texting the CSS Way
    • Dealing with Bi-directional Paragraphs (10:43)
    • Aligning and Text Direction (6:58)
    • Defining Fonts (8:24)
    • Types of Fonts (7:49)
    • Decorating and Indenting Text (5:29)
    • Paragraph Level Formatting (7:17)
    • Working with Windows and Orphans (3:10)
  • Content Manipulation
    • Cutting Things Out (6:02)
    • Adding Content Before and after Elements Dynamically (5:34)
    • Dynamically Counting (7:51)
    • Changing How the Cursor Looks Like (8:57)

View Full Curriculum


Access
Lifetime
Content
3.5 hours
Lessons
26

Mastering HTML5 Canvas

Design Changes Needed Fast? Time to Learn HTML5 Canvas

By Packt Publishing | in Online Courses

Web development is progressively getting more dynamic, and it's imperative that designers have the power to control visualizations fast. That's why HTML5 Canvas is so important. Powered by JavaScript, this powerful 2D API helps developers create graphics and animations directly in the browser. Your design workflow will be a breeze after you learn HTML5 Canvas.
  • Access 26 lectures & 3.5 hours of content 24/7
  • Familiarize yourself w/ the foundations of the canvas API
  • Learn how to create canvas elements dynamically & draw basic shapes
  • Discover drawing in HTML5 Canvas
  • Leverage the logic behind the cosine & sine functions
  • Understand the various types of curves, images & gradient colors
Ben Fhala discovered his passion for data visualization while he was working at Parsons in New York, in their data visualization department, PIIM. He is the owner of the online video training school, 02geek.com, and an Adobe ACP. He enjoys spending most of his time learning and teaching, and has a love for visual programming and visualization in general. Ben has had the honor of developing applications for members of the US Congress, Prime Ministers, and Presidents around the world.

He has built many interactive experiences for companies such as Target, AT&T, Crayola, Marriott, Neutrogena, and Nokia. He has technically directed many award-winning projects and has been part of teams that have won three Agency of the Year awards.

Among Ben's publications are HTML5 Graphing and Data Visualization Cookbook, and five video courses: jQuery UI Development; Learning Object-Oriented JavaScript; Mastering JavaScript; JavaScript Design Patterns; Web Visualization with HTML5, CSS3, and JavaScript, all for Packt Publishing.

Details & Requirements

  • Length of time users can access this course: lifetime access
  • Access options: web streaming, mobile streaming
  • Certification of completion not included
  • Redemption deadline: redeem your code within 30 days of purchase
  • Experience level required: all levels

Compatibility

  • Internet required

Course Outline

  • Getting Started with HTML5 Canvas
    • The Course Overview (2:25)
    • Preparing Our JavaScript for Canvas (9:34)
    • Canvas Hello World (6:19)
    • The Palau Flag and the Perfect Circle (5:03)
    • Creating Canvas Elements Dynamically (6:12)
  • Creating Shapes Using Paths
    • Drawing Our First Canvas Lines (9:43)
    • Meeting Canvas Paths (5:29)
    • Drawing Triangles with Paths (7:57)
    • Creating the Flag of Guyana (12:20)
    • Creating Multipoint Shapes (8:46)
  • Drawing with Angles
    • Working with Sine, Cosine, and Radians (11:31)
    • Creating an Animated Clock (9:46)
    • Creating Complex Shapes (10:26)
    • Adding More Vertices (11:48)
    • Overlapping Shapes to Create Other Shapes (7:22)
  • From Curves to Gradients
    • Drawing Arcs (7:00)
    • Drawing with Quadratic Curves (7:23)
    • Drawing with Bezier Curves (4:31)
    • Drawing Images into Canvas (7:10)
    • Creating an Interactive Linear Gradient (9:06)
    • Working with Interactive Radial Gradient (6:07)
  • Manipulating the Canvas
    • Working with Text (8:17)
    • Pixel Manipulation (7:22)
    • The Art of Clipping (9:16)
    • Transforming the Canvas (5:53)
    • Scale, Rotate, and Translate (6:29)

View Full Curriculum


Access
Lifetime
Content
2 hours
Lessons
25

Learning LESS

Use This CSS Extension to Develop a More Streamlined Workflow

By Packt Publishing | in Online Courses

LESS is an extension of CSS that allows you to speed up your development and make your stylesheets easier to produce. This course will introduce you to the main features of LESS and give you the know-how to speed up your workflow. Everyone could use a little more efficiency in their lives, but it's even more essential for web designers, so sign up today!
  • Access 25 lectures & 2 hours of content 24/7
  • Learn the basics of CSS preprocessing so you can work w/ LESS effortlessly
  • Automate LESS processing w/ task runners
  • Understand variables & how to use them within LESS files
  • Nest your CSS to improve readability
  • Power up your code w/ mix-ins
  • Work w/ parametric mix-ins to customize their output
  • Maintain code more easily w/ Extends
  • Use Color, Math & Image functions
Anthony Killeen is a veteran front-end developer who has been building websites since ‘97. In that time, he’s built websites for radio stations, music artists, photographers, communities, and businesses and he’s loved every single minute of it!

Anthony is a freelance developer and can be found at http://mrqwest.co.uk

Details & Requirements

  • Length of time users can access this course: lifetime access
  • Access options: web streaming, mobile streaming
  • Certification of completion not included
  • Redemption deadline: redeem your code within 30 days of purchase
  • Experience level required: all levels

Compatibility

  • Internet required

Course Outline

  • Introduction to LESS
    • The Course Overview (1:42)
    • What Is LESS? (3:14)
    • Woah! It's That Easy, Huh? (2:09)
  • Getting LESS into Your Current Workflow
    • LESS.js (5:02)
    • Using a Task Runner (6:08)
    • Using Third-party Software (8:17)
    • Using Our Code Editor (2:58)
  • Variables Can Make Our Lives Easier
    • What Is a Variable and How Does It Work? (5:59)
    • Advanced Variable Usage (2:35)
    • Basics: Nesting (3:12)
    • Advanced: Nesting (2:22)
  • Mixins
    • The Anatomy of a Mixin (3:36)
    • Using Mixins for Cross-browser Compatibility (4:16)
    • Parametric Mixins (3:15)
    • Writing Your Own Mixins (2:23)
    • Writing LESS Code with Extends (4:16)
    • A Final Word on Organization (3:37)
  • Power Up Your Code with LESS Functions
    • Color Functions (3:46)
    • Advanced Color Functions (7:25)
    • Math Functions (4:11)
    • Image Tools and Other Available Functions (5:26)
  • Power Up Your Frontend Tool-kit
    • Task Runners Such as Grunt or Gulp (3:59)
    • LESS Prefixer (2:10)
    • Emmet (5:02)
    • So, Where Do We Go from Here? (5:46)

View Full Curriculum


Access
Lifetime
Content
2 hours
Lessons
39

Building a Responsive Site with Zurb Foundation

Learning This Front-End Design Framework Will Save You Valuable Time & Effort

By Packt Publishing | in Online Courses

Zurb Foundation is one of the leading front-end design frameworks in the world. Foundation takes the hassle out of browser compatibility, media queries, style consistency and more by allowing you to build from mock-up to production with minimal effort. This tool is a must-learn for any aspiring designer, and this course is here to teach you how to optimize it.
  • Access 39 lectures & 2 hours of content 24/7
  • Scaffold a new website using Zurb Foundation
  • Play w/ a responsive design using Foundation's grid system & media queries
  • Create effective site navigation optimized for both desktop & mobile platforms using side-nav & magellan
  • Master different content elements using powerful Foundation classes & typography balance
  • Show effective media elements like flex-video, interchange & lightboxes w/o penalizing mobile users
  • Design beautiful forms to handle user input
  • Use Foundation JavaScript plug-ins to make content more dynamic
  • Customize the Framework style to transform mock-ups into production-ready websites
Andrea Moretti is a freelance developer. He has worked on various websites using Zurb Foundation Framework as well as big web application projects where Foundation is used side to side with other technologies. He is an active open source contributor and is actually maintaining Foundation templates for static site generator such as Middleman and Docpad.

He teaches JavaScript and PHP at Fusolab 2.0 in Rome and is an active member of the RomaJS JavaScript user group. He's passionate about beautiful code, functional programming, syntactic sugar, and sugar-free chocolate.

He is also a photographer and photo assistant, having worked on assignments for the major Italian magazines as well as luxury hotels, art galleries, Italian textile firms, big corporations, and food-related events.

Details & Requirements

  • Length of time users can access this course: lifetime access
  • Access options: web streaming, mobile streaming
  • Certification of completion not included
  • Redemption deadline: redeem your code within 30 days of purchase
  • Experience level required: all levels

Compatibility

  • Internet required

Course Outline

  • Introducing Foundation
    • What Is a Framework? (2:35)
    • Understanding the Working Environment (2:42)
    • Installing Foundation (2:36)
    • Why Use SASS? (2:55)
    • Scaffolding Our Website (3:01)
  • Making Our Site Responsive
    • Learning Media Queries (3:29)
    • Grasping the Grid System (2:52)
    • Seeing Visibility Classes (3:33)
    • Why to Go Mobile First? (2:58)
    • Using interchange.js (2:53)
  • Navigating the site
    • Browsing Off-canvas on Mobile (3:01)
    • Incorporating the Top Bar (2:36)
    • Implementing the Sticky-nav (2:55)
    • Incorporating the Side-nav (3:21)
    • Using Dropdowns (3:13)
  • Structuring the Content
    • Incorporating Tabs (2:47)
    • Beautiful Typography (2:50)
    • Implementing a Pricing Table (2:35)
    • Learning Accordions (2:36)
    • Using the Equalizer (2:20)
  • Adding Media Content
    • Incorporating Thumbnails (3:10)
    • Understanding the Block Grid (2:14)
    • Incorporating Flex-video (3:27)
    • Learning 'Interchange' (3:49)
    • Using Lightboxes (2:47)
  • Constructing Forms
    • Creating Basic Forms (2:11)
    • Understanding Form Utilities (2:07)
    • Implementing Switches and Ranges (3:12)
    • Using Abide Validation (2:48)
  • Buttons and UI Elements
    • Customizing Buttons (3:29)
    • Using Panels and Alerts (2:58)
    • Learning Tooltips (2:05)
    • Adding Modals (2:37)
    • Incorporating Pagination and Breadcrumbs (3:30)
  • Conclusions
    • Customizing Foundation (2:51)
    • Optimizing for Deployment (2:41)
    • Using Templates and the Zurb Playground (2:41)
    • What Have We Learned So Far? (2:55)
    • Where to Go from Here? (3:21)

View Full Curriculum


Access
Lifetime
Content
3 hours
Lessons
26

Web Visualization with HTML5, CSS3 & JavaScript

These 3 Technologies Will Be Your Web Design Bread & Butter

By Packt Publishing | in Online Courses

Web technology is constantly advancing and adapting, meaning designers need to have solutions to create excellent visualizations on the fly. HTML5 makes it possible to build interactive visualizations right in a web browser written in JavaScript, while CSS3 makes designing in HTML easier and more attractive. This course gets you up to speed on these cutting-edge technologies so you can ascend towards the gold standard of web design.
  • Access 26 lectures & 3 hours of content 24/7
  • Make your web designs stand out by learning the most important visual aspects of CSS3
  • Leverage CSS3 libraries to integrate gradients & patterns into your designs
  • Control & manipulate transformations of elements from 2D to 3D using scale, rotate, & the translate methods
  • Create, integrate, deploy, & animate SVG into our HTML5 application to enhance its look
  • Work w/ the Canvas 2D API to create & animate created elements w/ Canvas
  • Enhance the user experience using dynamic visualizations
  • Get to grips w/ animation using the jQuery & JavaScript library animations
Ben Fhala discovered his passion for data visualization while he was working at Parsons in New York, in their data visualization department, PIIM. He is the owner of the online video training school, 02geek.com, and an Adobe ACP. He enjoys spending most of his time learning and teaching, and has a love for visual programming and visualization in general. Ben has had the honor of developing applications for members of the US Congress, Prime Ministers, and Presidents around the world.

He has built many interactive experiences for companies such as Target, AT&T, Crayola, Marriott, Neutrogena, and Nokia. He has technically directed many award-winning projects and has been part of teams that have won three Agency of the Year awards.

Among Ben's publications are HTML5 Graphing and Data Visualization Cookbook, and five video courses: jQuery UI Development; Learning Object-Oriented JavaScript; Mastering JavaScript; JavaScript Design Patterns; Web Visualization with HTML5, CSS3, and JavaScript, all for Packt Publishing.

Details & Requirements

  • Length of time users can access this course: lifetime access
  • Access options: web streaming, mobile streaming
  • Certification of completion not included
  • Redemption deadline: redeem your code within 30 days of purchase
  • Experience level required: beginner

Compatibility

  • Internet required

Course Outline

  • CSS3 Visualization Techniques
    • The Course Overview (1:52)
    • Sprucing Up Your Design with Custom Fonts (7:02)
    • Gentle Roundness (7:31)
    • Leveraging Stunning Gradients (7:05)
    • Creating Patterns with Gradients (5:54)
    • There Is a Shadow Between Us (9:09)
    • Life Is More Colorful with Alpha Channels (4:47)
  • CSS3 Transformations and Animations
    • 2D Transformations with CSS3 (4:43)
    • Creating 3D Elements (8:23)
    • 3D Transformations with CSS3 (4:47)
    • Getting a Perspective of Things – 3D Things (3:13)
    • It's Time to Animate It All with CSS Transitions (2:55)
  • Drawing and Animating with SVG
    • Creating a Basic SVG Image (7:53)
    • Drawing a Circle in SVG (5:50)
    • Integrating SVG into HTML5 (4:41)
    • Creating a Polygon (6:14)
    • Animating SVG (5:20)
  • HTML5 Canvas
    • Browser Support and Canvas (6:20)
    • Starting to Draw (7:41)
    • Drawing a Grid in Canvas (8:24)
    • Animating Canvas (3:44)
  • JavaScript and jQuery
    • Dynamic Visualization (9:25)
    • Creating a Typewriter Effect (7:29)
    • Animations Need Order – Creating a Queue (6:15)
    • Creating a Callback and Activating the Queue (6:32)
    • Using an Animation Library (7:39)

View Full Curriculum


Access
Lifetime
Content
2 hours
Lessons
28

Building Responsive Data Visualization with D3.js

Create Bar Charts, Scatterplots & More That Look Great on Different Devices

By Packt Publishing | in Online Courses

In just 2 hours, you’ll master use of the D3.js library in conjunction with responsive design principles and technologies, such as Bootstrap and Pym.js. Combine the two to create stunning data visualizations that look great and—more importantly—effectively communicate their contents, no matter the viewing device.
  • Learn the basic structure of data binding in D3.js w/ over 2 hours of content
  • Construct a number of D3 visualizations: bar charts, line charts, scatterplots, etc.
  • Master D3 visualization features such as tooltips, axes & scales
  • Understand the importance of interactivity & transitioning between two states of a visualization for enhanced, responsive experience
  • Find, prepare, load & use external data sources: CSV, TSV, JSON & more
  • Enhance your web design skills w/ data visualization libraries like Bootstrap & Pym
Packt’s mission is to help the world put software to work in new ways, through the delivery of effective learning and information services to IT professionals. Working towards that vision, it has published over 3,000 books and videos so far, providing IT professionals with the actionable knowledge they need to get the job done–whether that’s specific learning on an emerging technology or optimizing key skills in more established tools.

Details & Requirements

  • Length of time users can access this course: lifetime access
  • Access options: web streaming, mobile streaming
  • Certification of completion not included
  • Redemption deadline: redeem your code within 30 days of purchase
  • Experience level required: all levels

Compatibility

  • Internet required

Course Outline

  • Building Blocks 1 – Noninteractive, Reusable Charts
    • Course Overview
    • Creating a Bar Chart with SVGs
    • Creating a D3 Bar Chart
    • Creating a D3 Line Chart
    • Creating a D3 Scatterplot
  • Building Blocks 2 – Adding Scales, Axes, and Labels
    • Adding Simple Labels
    • Creating Tooltips for Your Visualization
    • Utilizing D3 Scales
    • Adding Axes
  • Responsive Visual Strategies
    • Defining Responsive and Mobile-first Design
    • Using Media Queries and Addressing Breakpoints
    • Choosing a Visualization Style Based on the Media Type
    • Matching the Chart Size with the Container Size
    • Scaling All Visualization Elements Based on Container Size
  • Building Blocks 3 – External Data Sources
    • Integrating CSV Data
    • Getting Data from JSON
    • Building a Map with GeoJSON
  • Building Blocks 4 – Interactivity
    • Using Transitions
    • Filtering Data
    • D3 Layouts
  • Mapping with GeoJSON
    • Setting Up the Basemap
    • Choropleths
    • Adding Tooltips and Legends to Our Map
  • Making It Mobile-first
    • Drawing Maps According to Screen Size
    • Throwing in Bootstrap
    • Integrating Pym into Your Visualization
  • Moving Forward
    • Recapping What We’ve Covered
    • What to Read and Whom to Follow

View Full Curriculum


Access
Lifetime
Content
3 hours
Lessons
27

Mastering D3.js

Bring Your Data to Life By Creating & Deploying Complex Data Visualizations

By Packt Publishing | in Online Courses

This course provides clear instruction on D3.js, a powerful JavaScript library that enables users to generate data visualizations. Learn to create engaging data-driven apps by creating custom charts and integrating them with third-party libraries. At the end of the course, you'll receive instruction on a final project: creating an app that displays real-time data using enterprise-level dashboards.
  • Access 27 lectures & 3 hours of content 24/7
  • Create your own D3.js code that you can use for your future projects
  • Use functional programming, time formatting, & parsing to transform data from HTML to a cleaner CSV
  • Scrape & process data from the Web for your app
  • Delve into the intricacies of D3.js to build geography-based visualizations
  • Implement animation like transitions, delays, & timers to make things move in a controlled way
  • Get some extra help from libraries built on top of D3.js to implement additional features to your app
Packt’s mission is to help the world put software to work in new ways, through the delivery of effective learning and information services to IT professionals. Working towards that vision, it has published over 3,000 books and videos so far, providing IT professionals with the actionable knowledge they need to get the job done–whether that’s specific learning on an emerging technology or optimizing key skills in more established tools.

Details & Requirements

  • Length of time users can access this course: lifetime access
  • Access options: web streaming, mobile streaming
  • Certification of completion not included
  • Redemption deadline: redeem your code within 30 days of purchase
  • Experience level required: all levels

Compatibility

  • Internet required

Course Outline

  • Layouts
    • What Are Layouts?
    • Pie Charting Manually
    • Using a Layout
    • Default D3JS Layouts
  • Creating Layouts
    • Sketching Out the Idea
    • Making Our Code Reusable
    • Final Tweaks
  • Data Manipulation
    • Getting the Raw Dataset
    • Parsing and Cleaning the Data
    • Scope and Functional Style Coding
  • Geography
    • Drawing a Map
    • Adding Data to a Map
    • Geo Data
  • Creating Animations
    • Housekeeping
    • Animating with Timers
    • Delta-based Animations
    • Transitions and Easing
  • Interactivity
    • Improving the Main Animation Loop
    • User Animation Controls
    • More Interactions
    • Making the Visualization Responsive
  • Debugging and Best Practices
    • Debugging and Best Practices
    • Debugging the D3.js Code
    • Helpful Libraries
  • Visualization Design Primer
    • How to Approach a Visualization
    • Going from meh to wow
    • Some of My Favorite Visualizations

View Full Curriculum


Access
Lifetime
Content
1.5 hours
Lessons
29

Mastering Kendo UI

Optimize This UI Library to Reach a New Tier of Web Design

By Packt Publishing | in Online Courses

Kendo UI is a library that delivers everything you need to build a modern web application. Its full framework and extensive range of widgets, Kendo allows an enormous degree of flexibility for any web designer. In this course, you'll install Kendo UI, Bootstrap, and Telerik's backend services, and practice building your own applications. By course's end, you'll have a strong grasp of Kendo UI and be able to build your own apps quickly and with confidence.
  • Access 29 lectures & 1.5 hours of content 24/7
  • Explore Telerik’s backend services & set up your Kendo UI project
  • Wire up Twitter Bootstrap w/ Kendo UI MVVM for easier navigation through your app
  • Take control of the Content Editor by updating the properties of your view model
  • Manage your blog effectively w/ a few tweaks in the Kendo UI grid
  • Make your app responsive & rev up its security by implementing validation
  • Know your code better & troubleshoot errors away w/ Chrome Developer Tools
  • Get ahead w/ the advanced features of Kendo UI such as Layout, Views, Upload, & Router
Chuck Catron is a software developer who got started way back when Visual Basic 5 was cool. Before becoming a programmer, Chuck was in the Navy for 6 years as a Fire Control Technician working on a missile system. Chuck has been learning JavaScript, JQuery, and Kendo UI for the last 4 years. Chuck started his web development career in 2003 and has always strived to be learning and closer to the edge than the corner. Chuck is a husband, dad, step-dad, and dog dude.

Details & Requirements

  • Length of time users can access this course: lifetime access
  • Access options: web streaming, mobile streaming
  • Certification of completion not included
  • Redemption deadline: redeem your code within 30 days of purchase
  • Experience level required: all levels

Compatibility

  • Internet required
  • Kendo UI required (free trial available)

Course Outline

  • Set Up Your Project with Kendo UI and Twitter Bootstrap
    • Get Acquainted with CodeAnywhere (1:35)
    • Setting Up the Environment (2:05)
    • Setting Up Twitter Bootstrap (2:00)
    • Exploring the Telerik Platform (4:32)
  • Start Coding
    • Applying a Basic Twitter Bootstrap Layout (4:27)
    • Using Kendo UI Layouts and Views (1:22)
    • Creating the Navigation View and Subviews (4:23)
    • Wiring Up the Navigation Menu (2:06)
  • Building a Content Editor
    • Create an Inline Content Editor (4:26)
    • Configure the Content Editor (3:56)
    • Control the Controls (3:35)
    • Save Data from the Content Editor (3:54)
  • Building a Blog Manager
    • Create a Blog Manager (3:50)
    • Create a Blog Posts Manager and Editor (5:55)
  • Displaying Blog Posts
    • Display Blog Post(s) on a Page (4:31)
    • Display a Blog Post View (3:55)
  • Creating a Registration Page and Validating It
    • Create a Registration Page (3:01)
    • Create Kendo UI Observable and Add the Default Properties (1:44)
    • Implementing Kendo UI Validation (1:16)
    • Implementing Custom Validation (1:37)
    • Form Validation (1:32)
  • Troubleshooting
    • Using Chrome Developer Tools (1:19)
    • Using Console Logging (3:10)
    • Traverse JavaScript Code Using Chrome Developer Tools (2:54)
    • Using the Network Tab to See Network Traffic (5:24)
  • Advanced Kendo UI
    • Using the Kendo UI Layout (1:32)
    • Using the Kendo UI View (3:51)
    • Using the Kendo UI Upload (3:40)
    • Using the Kendo UI Router (2:36)

View Full Curriculum



Terms

  • Instant digital redemption