Programming By Stealth

In this week's installment, Bart explains how to create two simple Bootstrap components, the Jumbotron and badges. A Jumbotron is a show-case area at the top of a website's front page that shouts out the site's main message and usually has a call to action. Badges are the little bubbles next to titles or within buttons that contain extra information. Often they contain a number, such as number of unread messages, or a short phrase like "New!" or "Best Value". It's a pretty easy lesson and the homework looks fun too as we figure out how to add badges to count the number of open alert windows and add a Jumbotron to our work.

In this week's installment of Programming By Stealth Bart introduces us to Bootstrap Components how we can use jQuery to extend Bootstrap. This is the first baby step into JavaScript with Bootstrap. I'm glad Bart started slowly because my JavaScript muscles are just a bit stiff and dusty. You can find Bart's tutorial over at bartbusschots.ie/.... Please consider supporting Bart's work on Patreon.

Bart takes us back to Bootstrap content, now that we know all about breakpoints. He never told us when we were looking at things like margins and float and the display tag that they are also breakpoint-aware, because we didn't know about breakpoints yet. It's an easy lesson and it's great fun to learn more about how responsive design is done with Bootstrap. You can follow along with the audio with Bart's awesome tutorials at bartbusschots.ie/...

In this week's installment of Programming By Stealth, Bart Busschots explains Bootstrap breakpoints. Breakpoints allow the designer to define how a web page reacts depending on the size of the viewer's screen. He explains how through some very simple Bootstrap classes, we can allow a semantic tag to be in the "correct" order for screen readers and search engines, and yet have the layout be visually appropriate across all screen sizes. Follow along with Bart's detailed tutorial shownotes at bartbusschots.ie/...

Things take a turn for the mind-bendy in this installment about Bootstrap as Bart Busschots explains the Bootstrap Grid. He teaches us how containers have rows, rows have columns and the number 12 is really important. In the end he leads me to understanding but it was a bit of a bumpy road getting me there. You'll probably swim right through it without difficulty because of Bart's fabulous shownotes at bartbusschots.ie/.... If you a

We continue learning about how to style our HTML with Bootstrap as we take a look at styling images, figures, and tables. These Bootstrap classes are really easy to use and make such a difference in the look and feel. You can find Bart's tutorial shownotes and the downloads at bartbusschots.ie/....

We finished learning the Bootstrap Utilities last time so this time we get to start learning about continue to learn about Bootstrap moving on from the Utilities into Bootstrap Content. Content is kind of an odd word; it means Bootstrap's styling of regular HTML tags for things like headers, paragraphs, lists and tables. We have a lot of fun playing with our recipes in this episode, learning how to easily style them to be much prettier. Bart's fabulous tutorial shownotes are at bartbusschots.ie/...

In this week's episode of Programming By Stealth, Bart Busschots takes us through the last bit of the Utilities for Bootstrap 4. We'l refer to the WABAC Machine (kids, ask your parents about Sherman and Mr. Peabody) to installments 8 and 9 comparing positioning with CSS vs. Bootstrap. Thenwe'll learn about sizes and float utilities, Flexbox utilities, and Screen Reader utilities. It's great fun and of course Bart has his excellent companion tutorial at bartbusschots.ie/... and you can find Dorothy's awesome index of all things Programming By Stealth at podfeet.com/blog/pbs-index.

We're finally back to a new episode of Programming By Stealth after a few weeks chatting with different things like GDPR and DNS with Bart Busschots. In this installment, Bart starts explaining the Utilities available in Bootstrap. We'll learn how easy it is to use the pre-built CSS styles in Bootstrap to color text, add borders, spacing, text alignment and fonts all with semantic phrases that actually make sense! In an odd bit of luck, Bootstrap had been updated and Bart's code didn't reflect the new version. In most shows, this would be a problem but the change allowed Bart to walk me through how to figure out what was wrong and how to access the Bootstrap documentation to fix it. The best way to learn something is to break it first, or at least Bart and I feel that way. Bart's most excellent shownotes are at bartbusschots.ie/...

We're finally back after spring break, and we're going to be moving on from JavaScript while we learn about Bootstrap. Bootstrap is a set of open source libraries which provide pre-built foundations for creating responsive and good looking websites. It's an easy episode with easy and fun homework I think you'll enjoy. Before we got started I talked about a fantastic post Will (aka @beiju) wrote to me to help me understand JavaScript objects better. If you've been struggling like I have or just want a nice reference written in conversational style, check it out at Objects in Javascript Explained (for PBS) – by Will aka @beiju

As our last episode of Programming By Stealth before our spring break, Bart wraps up our Cellular Automaton. He goes through his solution to the PBS 49 challenge first, and then he walks us through three examples of how a user could produce three different representations with our code. He demonstrates how to build a Conway Game of Life, the Maze Rule, and Brian's Brain. It's fun to see it all wrapped in a bow ending this long project. We'll be back on March 31st with a whole new project. Bart's full tutorial shownotes are at bartbusschots.ie/...

This week Bart and I celebrate 50 episodes of Programming By Stealth. As Bart points out, we've been at this for two years now. I'm so happy he's stuck with me on this and he says he's got literally years of material yet to go. To commemorate this occasion, Bart got the crazy idea to build a web app live on video. We used a YouTube Live Hangout on Air while he shared his screen. He started with a blank canvas and when he was done we had a working web app. The video is probably a better experience over at podfeet.com but the audio is supplied for those who prefer it. We did try to narrate what was going on to help with the audio.

As promised last week, Bart Busschots brings us the second half of Programming By Stealth 49. We start by going through a lot of revision on JavaScript objects. It's really great to have all of this all in one place, and I got to ask a few questions that have been bugging me for a long time. I understood every bit of this and really enjoyed it, but I'm not going to lie, his little 6-part test after the revision baffled me a bit. But after we slog through that part, Bart gets us back on track improving our Cellular Automata. I never realized that we didn't actually define whether our cells are dead or alive!

In this week's episode of Programming By Stealth, Bart had intended to work on improving our Cellular Automata, but we ended up spending a lot more time on reviewing the challenges from last week that we stopped before getting to the new stuff. The good news is that we're going to do the Cellular Automata improvements in only one week (it will be PBS 49B), and we have no homework for the week! As always, Bart's excellent tutorial shownotes are available at bartbusschots.ie/....

Bart decided to take a closer look at the JavaScript keywords 'this' and 'static' and boy am I glad he did. He said it was the hardest lesson he's put together so far. It's a convoluted topic but he gives great explanations as always. You can find his tutorial at bartbusschots.ie/...

In this installment of Programming By Stealth, Bart teaches us about inheritance (relationships between classes) and polymorphism. Now he said polymorphism is a concept that throws most first-level college students, but in an odd twist, I didn't find it confusing at all! Plus, he lets us play with cows, ducks and turkeys in his example so it's loads of fun. We also have a great new study tool created by Dorothy, aka MacLurker. She created an index of terms so you can jump right to the blog post where Bart talked about the term. I've been using it and it's grand! You might want to bookmark podfeet.com/blog/pbs-index. As always, Bart's most excellent written tutorial is available at bartbusschots.ie/....

In this installment of Programming By Stealth, Bart adds one more thing to the list of changes to arrays, and that's the spread operator. Then we'll learn how to get rid of the "const self = this" kludge for callbacks using the arrow functions. After that, we learn the basics of classes, a concept introduced in ES6 which brings JavaScript into the world of other C-style languages. Bart's excellent written tutorial for this installment is available here: bartbusschots.ie/... Bart at the end asks a question - would you be interested in learning how to build command line apps using JavaScript? So far we've only be working on web apps, but command line apps will allow us to manipulate things in the file system, the network and even to the Internet itself without using a web browser. Let us know via email to me at [email protected], or write up your thoughts in our Facebook group at podfeet.com/facebook or our Google Plus group at podfeet.com/googeplus or you can even tweet us at @podfeet and @bbusschots.

In this week's Programming By Stealth, Bart starts by actually giving me credit for leading him to rethink his strategy on the use of const and let. He was nudged along in the strategy by the most awesome Jill. Then Bart goes on to reveal even more of the joy that is JavaScript ES6. He explains ES6 Arrays, how to loop through Arrays, and in a change that brings a tear to my eye, the simpler way you can now loop over Strings and how concatenation is a thing of the past when building strings. This is truly a joyful show! As always, Bart's detailed tutorial is available at bartbusschots.ie/...

In this installment of Programming By Stealth, Bart Busschots teaches us new ways to deal with arguments and objects in JavaScript ES6. We learn how to set default argument values for functions in a way that is self-documenting. He explains how variadic (aka Rest) arguments allow you to shove all of the arguments of a function into an array. Then he walks us through how to use for ... in loops to loop over objects. He reminds us of the difference between instance and static properties and explains how for ... in loops work with both kinds of properties. I really enjoyed this episode and followed almost all of it on the first time through!

In this installment of Programming By Stealth, Bart spends most of the time talking through his solution to the previous challenge, where we added start and stop buttons to our Game of Life. In his solution he actually modifies the prototype to accommodate the ability to add these buttons. He explains his process and his decisions along the way. I'm not going to lie, this one confused me quite a bit in the middle but we both hope it's because we've been away from the hard-core JavaScript for quite a while. Once we have that under our belts, he starts explaining some of the cool, new features in JavaScript ES6 where we abandon var and replace it with let and const. He explains the value of these new terms (and the problems they solve!) Bart's full tutorial is available as always at bartbusschots.ie/...

CCATP #507 for October 29, 2017, and I'm your host, Allison Sheridan. It is also a Programming By Stealth, installment 42 of X with Bart Busschots. It's finally time to tie all the bits and pieces we've learned together and create our first web app. Armed with our HTML, CSS, jQuery and JavaScript knowledge, and our Cellular Automata Prototype, Bart walks us through how to bring the Game of Life...to Life! It's a lot of fun and I understood a great deal of it (I'm not gonna lie, it wasn't 100% this time.) As always Bart's amazing tutorial for this episode is available at: bartbusschots.ie/

In this episode of Programming By Stealth, Bart ties up the last of the loose ends related to web forms. He teaches us about form events, which are critical to making our web forms not only accessible to screen readers but to allow our users to tab around to the different fields and interact with them without using a mouse. We learn about the keypress event and learn what it means for 31 to be the space key.

In a shocking turn of events, I actually followed all of Programming By Stealth this week! Bart walked us through his solution to last week's HTML5 Forms Validation homework, and in so doing highlighted some especially clever things he did. I was pretty pleased with my own version of the homework, and in fact Bart gave me a gold star for one thing I did. Bart also explains how he used CSS to make his form even more readable. In the second half of the episode he shows how to use jQuery to improve the forms even more. He demonstrates how certain requirements cannot be met with the built-in forms validation and how we can use jQuery instead. I loved this episode because it tied in our knowledg of jQuery back to HTML forms. Bart's most excellent written tutorial can be found at PBS 40 of x – HTML5 Custom Validations with jQuery on bartb.ie.

This week Bart Busschots joins us to talk about HTML Form Validation. We'll get back to our Cellular Automata next week. Bart has also decided that we're going to get our feet a little bit yet by using GitHub where we'll be getting the challenges and solutions from now on. You can see Bart's awesome tutorial at bartbusschots.ie/...

We finally reached 500 episodes of Chit Chat Across the Pond (episode 499 will be next week) so who better to have on the show than Bart Busschots who started it all? In our first Programming By Stealth after our summer vacation, Bart decided to do a retrospective on what we've learned to date from HTML to CSS to JavaScript. I thought it was a great episode because it refreshed my memory on so much that we've done. He even put together a set of quiz questions for each section and shockinglyI didn't do too badly at them! It was a lot of fun and I hope you enjoy this refresher episode as much as I did. Of course Bart's fabulous written tutorial is available at bartbusschots.ie/...

I've been asking Bart a lot of questions in the back channel as I struggle to understand the documentation he has provided in our latest few sessions of homework assignments. He had an epiphany last week that he had never explained the documentation methods itself, which was certainly adding to my confusion. He decided to take a step back and explain step by step using video. He created a video screencast of the entire process of creating documentation using JSDoc. Then during the audio recording you'll hear in the podcast, he walked through it again while I asked him (lots of) questions. Hopefully it will be as eye opening to you as it was to me. He also demonstrates his favorite tools for the process. You can find Bart's blog post with the embedded video screencast at bartbusschots.ie/...

Chit Chat Across the Pond this week is another episode of Programming By Stealth with Bart Busschots. I'm very proud of the fact that I completed my homework, writing a program from scratch that passed all of the tests written by Bart. It took me 12 hours, and nearly 4 hours of Dorothy's time helping me do it, but I got 'er done. In this installment, 36 of x, we learn some more HTML, specifically about all the cool things the input tag can do, like creating invisible forms which is just weird but also very cool. The challenge this week is a flip on last week. This week Bart has written the next bit of code for us and we have to create the tests. It's as challenging as all the rest but it's just as fun. And of course you can find Bart's fabulous tutorial show notes at bartbusschots.ie/...

In this installment, Bart walks us through a little bit of how he wrote his Test Driven Development with QUnit for the Bartificer Link Toolkit. Bart even explains how it helped him find a couple of pretty major bugs in his own code, proving how important this is. Then we make a start on text input in HTML forms, and we move on to formatted sub-stets of tea like numbers, email addresses and so on. Finally, we make a start on what will be an on-going project. The idea is to combine our understanding of HTML, CSS, JavaScript, jQuery, and QUnit to implement a zero-player with a really cool computer science back-story.

In this installment of Bart’s Programming By Stealth series, we review our test code using QUnit, and then learn how to use QUnit to test our code within a real browser page. We do that using the API we built together, the Bartificer Link Toolkit that identifies external links on a web page, makes them open in new tabs, adds the tag rel=noopener, and adds a cute icon to identify them as external links. As always Bart’s terrific written tutorials and downloadable examples are available at pbs.bartificer.net/...

In this installment of Programming By Stealth, Bart FINALLY lets us start learning Test Driven development, or TDD. He shows us how to use a free and open source tool called QUnit, made by the fine developers of jQuery, to analyze our test code. It’s something I’ve been itching to learn more about, ever since listener Jill tipped us off to the concept. It’s a really fun episode where everything kind of comes together. Hope you enjoy it as much as I did. As always, Bart’s excellent written tutorial for the episode can be found at pbs.bartificer.net/...

This week Bart and I put the finishing touches on our Date and Time prototypes, then we use those very JavaScript prototypes with HTML forms, we learn bout JavaScript error handling (including throwing and catching errors) and the we start manipulating HTML Selects with jQuery. If that sounds as fun to you as it was to me, check out Bart’s full detailed show notes at pbs.bartificer.net/...

Bart and I may have broken a record on Chit Chat Across the Pond this week. We went through so much material in Programming By Stealth that this show runs 100 minutes! The funny thing is that I wasn’t ever bored, it was all really interesting. We started by going over last time’s JavaScript challenge where I made some mistakes but node.js saved me so I didn’t realize I’d entirely missed the point. I’m still getting the hang of that object thing. The we learned one final new concept related to JavaScript prototypes: static functions. The we finished that we went over to the html side and learned how to make forms, checkboxes and radio buttons. Not nearly as mentally challenging as JavaScript to be sure, especially since you can see the changes right on screen when you mess with them. Speaking of messing with them, Bart teaches us how to use jQuery to find out what our buttons and checkboxes say and to change them. He does this all with particular attention to using ARIA to ensure our html is accessible. As always you can find his excellent tutorial to follow along at pbs.bartificer.net/...

Bart continues his current dual path of teaching. We learn how to compare JavaScript objects (spoiler, you can't use == or === to do it). After that he teaches us how using WAI-ARIA as we develop our code will make it accessible to screen readers and other assistive devices. We don't do any real coding in this section; instead he explains the foundation for what we'll be doing in the future.

I don’t want to jinx anything here, but I feel like I’m finally starting to “get” this JavaScript programming thing. In this episode of Programming By Stealth, Bart starts by talking about how we solved the challenges from last week, getting rid of “bad smells” by learning how to reuse our code. Then Bart teaches us about another bad smell, where inadvertently point two variables point the same object and he teaches us about the clone function to eradicate that problem. With that bite-sized JavaScript lesson behind us, he takes us forward into learning about Glyph Icons, a way of having scalable icons on our web pages instead of pixel-based icons. He introduces us to Font Awesome tool to get free access to (awesome) scalable glyph icons. The full tutorial is available at bartbusschots.ie/….

In this week’s installment of Programming By Stealth, Bart teaches us about how to change the look of HTML buttons using their CSS attributes. It’s great fun, but I have to confess we don’t actually get to the new stuff till over an hour into the show! We had so much fun going through the homework from last time that we lost track of time. I was so excited because I’d worked really hard on my homework this time and was able to actually conquer the first two parts (with some help from my friends) but I did struggle a bit with the third piece where I had to assemble them together. Anyway, we decided it’s ok if you skip ahead to the CSS parts if you like; it starts at an hour and six minutes in. As always the full written tutorial with examples is at bartbusschots.ie/…

On this week’s continuing series Programming By Stealth, Bart introduces us to HTML forms in order to take user input. It’s a pretty basic installment so not as head bendy as they have been lately. He also gives us some more repetitive homework to get more practice creating and using prototypes and accessor methods. The full written tutorial can be found at bartbusschots.ie/….

Bart Busschots is back with another installment of Programming By Stealth. In this week’s episode we wake Allison up from her long winter nap away from programming and continue our work on our JavaScript clock. The goal is to create a better API for our clock so that we can publish it and have it be used by others. My personal goal is to have a secure clock I can display on https://podfeet.com/live so that you know when it’s coming up on 5pm at my house and hence time for the NosillaCast Live. In order to achieve this goal, we need to learn how to add data attributes within html, and then change those attributes using jQuery. Dust off your memories of prototypes and screw your propeller beanie on tight for this one! Link to the full tutorial is available at bartbusschots.ie/…

Bart gave me another two weeks to get my homework done on Programming By Stealth and brings us a case study of how to create a JavaScript API on Github. He uses a real life example of a small, open source library he released over the weekend called barfificer.linkTookit.js. This library includes many of the bits and pieces we’ve been working on in Programming By Stealth, how to add a rel of no opener on all links with a target of _blank (the ones that open in a new tab) and adding a little icon in the url to politely tell the reader that you’ll be navigating away from the page you’re on. It’s a great lesson in the structure of how Github works and even more importantly how it automatically creates beautiful documentation from Markdown comments in the code. Tutorial shownotes are available at bartbusschots.ie/...

In this week’s installment of Programming By Stealth, Bart teaches us how to create a JavaScript API up to and including an easy way to create professional documentation in order to publish our work as a JavaScript library. In order to get there we learn how to write reusable and sharable code, how “closures” help you keep your variables out of the global scope so they don’t mess up other people’s code, we learn one Ternary Operator), and my favorite, self-executing anonymous functions. Apologies for getting the episode number wrong in the audio – I said it was #460 when it’s actually #461. You can find Bart’s tutorial we follow in this episode at bartbusschots.ie/….

In this installment of Programming By Stealth, we’re working towards our first truly practical assignment in the series – a function that finds all links on a page, and if, and only if, they lead to an external page, alters them to open in a new tab, and appends an icon indicating that fact. Bart’s amazing full on tutorial is over at bartbusschots.ie/…. I also mention a fun little jQuery Easter egg, which you can find at citymapper.com. Just follow the link and open the console on your favorite browser and you’ll find a text based adventure game!

Bart Busschots joins us again for his continuing series called Programming By Stealth. In this episode Bart explains how to embed JavaScript into a webpage, how to control when JavaScript executes and then teaches us about the browser event model. Using this model he teaches us how we can change things on a web page when the user clicks or after a defined length of time, or at time intervals. It’s our first time outside of the sandbox so it’s great fun to manipulate web pages and have them do our bidding! Bart’s full tutorial is at: bartbusschots.ie/… and it includes some downloadable files that are very useful for following along.

In this episode of Programming By Stealth, Bart ties up the last of the loose ends related to web forms. He teaches us about form events, which are critical to making our web forms not only accessible to screen readers but to allow our users to tab around to the different fields and interact with them without using a mouse. We learn about the keypress event and learn what it means for 31 to be the space key. Bart’s excellent tutorial is at over at bartbusschots.ie/…

In this installment of Programming By Stealth with Bart Busschots, we finally break out of the sandbox and learn how to use the console in a web browser to start taking control of web browsers. Bart's full tutorial is available at bartbusschots.ie/….

In episode #449, Bart Busschots walked us through how he'd solve the first half of the JavaScript challenges from PBS 19. This week we finish the second half of the 5th problem about Complex Numbers. Like the last episode, we're giving you the audio in the podcast, but if you'd like to watch the video of Bart building the solutions, you can see that over on podfeet.com.

Bart Busschots got the crazy idea that we should do this episode as a video so that he could solve the JavaScript challenges from PBS 19 real time and talk through it as he solved them. I figured it would be mean to drop a giant video into your feed, so this is actually just the audio which is cool too, but you can go watch the video on podfeet.com.

In this episode of Programming By Stealth, Bart Busschots takes us through the final stages of learning JavaScript within the playground. Now that we know about objects, we need to re-visit the arguments object present in every JavaScript function. We need to take a detailed look at the typeof operator, and we need to look at some built-in objects and functions JavaScript provides. We also need to look at how JavaScript handles regular expressions, and finally, we need to introduce the concept of exception handling. Bart's full written tutorial is available at bartbusschots.ie/....

In this continuing series with Bart Busschots, we get a more detailed look at objects, and then we look at some standard functions and objects that are built into JavaScript. We also take a proper look at two operators we've seen before, typeof and instanceof. Bart's full written tutorial is available at bartbusschots.ie/....

In this installment of Programming By Stealth, Bart Busschots takes our understanding of functions to the next level. The techniques we encounter today would be considered advanced techniques in most other languages, and you could spend years developing in Java and never encounter an anonymous function. However, because of how JavaScript is integrated into HTML documents, these techniques are considered fundamental in JavaScript, and anonymous functions are a dime a dozen! Before we delve into anonymous functions, we’ll start by taking a deeper look at how JavaScript deals with function arguments. Bart's full tutorial is available at bartbusschots.ie/....

In this week's episode of Chit Chat Across the Pond, Bart Busschots is back with Programming By Stealth episode 15 of x where he's going to teach us about JavaScript functions. he'll twist our brains a bit with recursive functions but it's a fun ride. And there's even a challenge at the end! And as always, here's a link to Bart's terrific tutorial for the episode: bartbusschots.ie/...

We're back to Programming By Stealth with Bart Busschots where he explains how to create Arrays in Javascript and how to use "while" and "for" to create loops to access the information in Arrays. It's a little bit of a propeller beanie episode but we powered through till I got it! And as always, here's a link to Bart's terrific tutorial for the episode: bartbusschots.ie/....