HTML All The Things - Web Development, Web Design, Small Business
The adventures of Matt Lawrence and Mike Karan through the world of web development, web design, and small business management. As web development agency owners for the better part of a decade, they’ve worked with all sorts of technologies, through the rise of responsive web design, the revolution of serverless computing, and the popularity gain of many no-code tools for small business owners. They commonly discuss foundational web development technologies like HTML, CSS, and JavaScript - including popular frameworks and tools such as Tailwind CSS, Svelte, WordPress, Vue, and more.
Episodes
Wednesday Aug 29, 2018
Troubleshooting Your Code
Wednesday Aug 29, 2018
Wednesday Aug 29, 2018
In this episode we dive into the world of troubleshooting and debugging exploring different methodologies and tools that should help you take out any pesky bugs you might come across.
Segment 1 - Troubleshooting Methodologies
Process of Elimination
Slowly eliminate parts of your code that might be the culprit
Narrow down the culprit then perform the process of elimination on the section that is causing the issue
Don't be afraid to Google/research
Researching is nothing to be ashamed of, it does not mean you don't know what you're doing
As you look things up you'll be enhancing your researching skills, which is helpful when treading into new technologies
Learn the Source
Don't just bandaid the issue
Find out the who, what, where, when, why, and how
Apply an actual fix to the issue wherever possible and take measure to prevent it from happening again
Segment 2 - Debugging in the Browser
UI/UX Debugging
Using console window on Google Chrome
Inspecting elements to determine proper positioning and check if something is overlapping
Primarily use: Elements View, Styles View, and Console
Using console.log to check how a program is running
Advanced Console Debugging
JS Breakpoints to check on parts of programs
Better than console logs in some more advanced cases
Can check all local variables at a select breakpoint
Postman for DB Debugging
Segment 3 - Application/Storytime
Troubleshooting Cordova Apps on Android
Longevity testing
Wireless adb debugging
Passing console logs through from webview to Android through an interface
Crashing issues
Media playback issues
VPN Gateway Failure (some details changed for security procedure
IT support issue
Establishing a tunnel worked but routing internally didn't work
Ended up being an NDP issue
Most advanced troubleshooting Matt has possibly done (most involved - over 2 weeks of work)
Web News - Experience Doesn't Trump Research
Don't shy away from research
We typically have the documentation of a given framework or library that we are using, pulled up on a tab at all times
Impossible to commit everything to memory
Getting muscle memory, intuition, and research skills down pat makes you a proper "technician" for software engineering and IT work
You can find us on...
Facebook | Twitter | Instagram | Medium | YouTube | GitHub | Spotify
Wednesday Aug 22, 2018
Planning and Working on Projects
Wednesday Aug 22, 2018
Wednesday Aug 22, 2018
In this episode we dive deep on how to tackle projects, whether they be something for the company, or something for a client. We take a look at the tools we use to organize it all, and how we stay on top of working in a small team.
Segment 1 - Idea Filtering
Brainstorming and how to track it all
Jot down informal notes, even if ideas are obviously bad
Sleep on your ideas - don't develop them too much too quickly or you'll get ahead of yourself
Sometimes you get a "packed idea" that needs attention immediately
Bouncing ideas off of technical and non-technical people
Live prototyping of easy to try ideas
Having meetings to filter the good from the bad
Grilling each others ideas - will the product make it in the market?
Segment 2 - Planning With and Using Tools
Using a variety of tools for communication and organization
Examples: Slack, Twist, Monday.com, Asana, Git (gitlab, github, bitbucket), email/contacts/calendar, trello, etc.
Our procedure on handling projects that we do for ourselves (for Digital Dynasty Design)
Day to day tools including things like: Google Hangouts, Git, OneDrive, Trello, Asana
Segment 3 - Client Work vs Personal Projects
Matt works on small business client work as well as any projects that Digital Dyansty Design has running
Mike focuses on client works and assists with Digital Dynasty Design projects whenver he can
We treat client projecs differently than our own projects
Get client objectives written down crystal clear
Cost analysis
Deadlines
Design suggestions and comparative materials
Daily Meetings
Dealing with client and personal schedule needs
Segment 4 - Completion and Accountability
Accountability is difficult when you're your own boss
Need dicipline and hard deadlines that you need to keep
Sometimes deadlines need to be changed due to project changes or other issues, but don't make a habit of it
Fill out a log book to keep track of the work you do on a daily basis
Web News - Stress When Deploying to Production
Even senior developers get stress when they are pushing to production
Make backups, make an easy recovery path if possible
Test everything you can to prepare
You can find us on...
Facebook | Twitter | Instagram | Medium | YouTube | GitHub | Spotify
Wednesday Aug 15, 2018
Reactive Frameworks - Vue.js
Wednesday Aug 15, 2018
Wednesday Aug 15, 2018
In this episode we discuss our journey from static and CMS driven sites to reactive frameworks, specifically Vue.js.
Segment 1 - Static to Reactive
Started by creating simple static sites - no need for reactive elements
When dynamic/reactive content was needed we would use document.createElement
Segment 2 - CMS to Reactive
We would use Wordpress, CouchCMS, or Webflow for any content management that our users would need
Eventually elements became too varied and a dynamic solution was needed - reactive frameworks
The "Hub" presented a unique issue of not having a standard layout while still being "posts" (the episode clarifies this point)
Segment 3 - How We Plan to Use Vue.js
Quick start guide for people to get up and running
HexDash a collaborative project that people can contribute to
Vue.js components - great for reusability
Vue.js will be used in the making of the HTML All The Things website
Segment 4 - Matt's Experience Getting Quickly Started with Vue.js
Moving over from a typical experience using vanilla HTML/CSS/JS, SASS, Bootstrap, Webflow, or CouchCMS
Prior experience with CLI and NPM
First time using Visual Studio Code
Web News - Trendy & Loud vs Silence
NodeJS vs PHP
Big frameworks vs old ones
WordPress power 31% of the internet (Source: https://wordpress.com)
WordPress vs Webflow
Workflow conflicts
Are freelancers using bleeding edge technology, while the rest of the industry (specifically big enterprise) still using "old" tech?
Wednesday Aug 08, 2018
Failures and Shortcomings
Wednesday Aug 08, 2018
Wednesday Aug 08, 2018
In this episode we explore our failures and shortcomings on a variety of our projects ranging from a stock photo resource to a fully-fledged Chrome App game.
Show Layout
Segment 1 - Starting Up
Originally going to be an IT company
Opportunity caused us to pivot before the opportunity fell through
Decided to continue working in the web development and design field
Segment 2 - Lists by Design
Product Page: Link
First Chrome extension
Was mean't to be a bookmarks replacer
Added a lot of functionality that bookmarks don't have
Segment 3 - Clicks to Riches
Product Page: Link
Clicker/Idle game in the form of a Chrome App
Was supposed to be a smaller version of a larger project
Designed to generate revenue whilst working on the larger project
Segment 4 - Free Photos Hamilton
Website: Link
Free stock photo resouce
Designed to offer free photos, focussing on the local area of Hamilton, Ontario
Segment 5 - Dealing and Mitigating Failure
How to deal with failure and get ready for it before it even happens
Always learn new things even if a project has failed totally
Web News - Windows vs MacOS
The age old argument, who will win?
Social Links
Facebook | Twitter | Instagram | Medium
Wednesday Aug 01, 2018
Workflow
Wednesday Aug 01, 2018
Wednesday Aug 01, 2018
In this episode we discuss our different workflows individually and collaboratively as a company.
Segment 1 - Infrastructure
Started out using OneDrive
Later started using BitBucket and GitHub
Version control was needed more as projects grew in productivity
Segment 2 - Mike's Workflow
Primary IDE is VS Code
Xcode and Android Studio whenever a project calls for it
Asana and Todoist
Xampp
Daily routine
Segment 3 - Matt's Workflow
Notepad++
CMD
Chrome
Testing browsers
Balsamiq Cloud
Workflow for small business basic site
Workflow for projects
Segment 4 - Working Together/Collaborative Workflow
Working together on OneDrive
Dividing up parts of projects
Code reviews/peer reviews
Project management software
Whiteboard project management
Web News - App Overload
Discussion on how to manage app overload
There are so many solutions to every problem and many of them have apps, this can cause app overload if you work on several projects.
Wednesday Jul 25, 2018
Where to Start
Wednesday Jul 25, 2018
Wednesday Jul 25, 2018
In this episode we explore how to get started in web development and web design. We discuss some of the methods we used to get up and running and share some stories on our initial experiences in the field.
Topics covered in this episode include:
Segment 1 - Mike's Beginnings
Original exposure to code & first projects
Segment 2 - Matt's Beginnings
Original exposure to code & first projects
Segment 3 - Libraries & Frameworks
SASS - Official Site
Bootstrap - Official Site
Tailwind CSS - Official Site
jQuery - Official Site
Lightbox - Official Site
NodeJS - Official Site
Vue - Official Site
Flutter - Official Site
Segment 4 - When to Choose a Premade Solution
Website builders
Service providers
Snippets & Plugins
Examples include:
Webflow - Official Site
Podbean - Official Site
Carrd - Official Site
CouchCMS - Official Site
Segment 5 - Web News
Flutter
You can find us on...
Facebook | Twitter | Instagram
RSS | Patreon | Spotify
Medium | YouTube | GitHub
Reddit
Tuesday Jul 17, 2018
Pathways & Foundations
Tuesday Jul 17, 2018
Tuesday Jul 17, 2018
In this episode Matt Lawrence and Mike Karan discuss their professional experiences that led them to today. These experiences form a foundation for future podcasts and act as a reference moving forward.
Topics covered in this episode include:
Personal Introductions
Segment 1 - Synopsis of Today
Digital Dynasty Design
Web design and development business
Passive income projects
Segment 2 - Education
College and University educations and experiences
Mohawk College
McMaster University
Segment 3 - Work Experience
IT and administration
Electrical drafting
Co-ops
Segment 4 - HATT
What is HTML All The Things?
You can find us on...
Facebook | Twitter | Instagram
RSS | Patreon | Spotify
Medium | YouTube | GitHub
Reddit