David Maciejewski macx

"7 Developer Tools secrets that shouldn't be secrets" resources

Slides

The Slides

Console

Tips

Mouse click lost after a while

The solution is to search and kill the processes named /usr/bin/VBoxClient --draganddrop

Search pgrep -a VBoxClient
Kill kill <pid> (or do both with tools like htop)

Shared clipboard lost after a while

The solution is to kill the current processes named /usr/bin/VBoxClient --clipboard and start a new one.

Search pgrep -a VBoxClient
Kill kill <pid> (or do both with tools like htop)

Avoiding CSS overrides in responsive components

I would like to demonstrate some of the benefits of scoped styles over mobile-first CSS with overrides for wider breakpoints. I'll start by explaining the two approaches, before listing the benefits.

Mobile-first with overrides for wider breakpoints

h2 {
  color: black;
 font-size: 2em;

Given a subscribed calendar with a url like

https://example.com/example.ics

To force Google Calendar to refresh and reload the contents right now, unsubscribe from the calendar and subscribe to a new calendar with a URL like

https://example.com/example.ics#1

Adding the anchor tag will force Google Calendar to think of it as a new calendar

This script for Google Spreadsheets allows you to generate slugs for your data such as might be used for creating unique urls.

Use it like this!

#	A	B	C
1	a	b	slug
2	foo	baz bing	=slugify(A2:B4)
3	bar	BAZ
4	FOO	baz-bing

The command line, in short…

wget -k -K -E -r -l 10 -p -N -F --restrict-file-names=windows -nH http://website.com/

…and the options explained

-k : convert links to relative
-K : keep an original versions of files without the conversions made by wget
-E : rename html files to .html (if they don’t already have an htm(l) extension)
-r : recursive… of course we want to make a recursive copy
-l 10 : the maximum level of recursion. if you have a really big website you may need to put a higher number, but 10 levels should be enough.

GitHub Markdown Theme for Visual Studio Code

This CSS stylesheet allows you to preview markdown files in VSCode using GitHub's mardown theme. This CSS was taken directly from the official GitHub Markdown repo. I replaced their top-level .markdown-body class with the body tag so it would work in VSCode, and added styling for the html tag to match GitHub's fixed-width container.

Instructions

Copy the CSS file to your computer
Copy the github-markdown.css file below to your computer. You can put it anywhere you want, but I chose to put it in the same folder as my VSCode settings file.
Edit your VSCode settings
If you want to use this theme for all of your projects, then edit your User Settings file. If you just want to use this them

	//###[ CASH ]###########################################################################################################

	// keep this here in case we want to extend $ or $.fn
	import $ from '@client/cash';

	_each(
	'blur focus focusin focusout resize scroll click dblclick mousedown mouseup mousemove mouseover mouseout mouseenter mouseleave change select submit keydown keypress keyup contextmenu'.split(' '),
	(event) => {
	$.fn[event] = function(callback){
	if( callback ){

	// Escaping Liquid in SCSS.
	//
	// Expected output:
	// a{
	// color: {{ settings.link-color }};
	// }

	a{
	color: #{'{{ settings.link-color }}'};
	}