Alex Earley DevEarley

Build your own node tools

Node tools have become really useful for development. I personally use them all the time. Node-Sass and Watch-Http-Server are a big part of my day-to-day. And of course, Angular CLI. So how can you build your own tool? It is easy.

Setup your Environment

Lets create a tool called something-awesome. For starters, create your git repo (optional).

git init something-awesome

Dark mode, ENGAGE! User Preference Media Features in your responsive web app.

The dark theme option has been around in apps for awhile. But now, it's common to offer a dark theme at the OS level. I personally love this feature. I stare at screens all day! Also, I use OLED devices. Naturally I want EVERYTHING to be dark themed when I pick that option. Unfortunately, the majority of the web has not adopted this standard whole-heartedly. ( To be fair, it is kinda new, as of writing this, these features are still in draft. )

This doc will outline solutions to two problems. First, how to architect theming in your CSS / SCSS in an efficient way. Second how to access your theme from JS ( and why you would need to do that)

(I developed this on a Mac using Mojave 10.14 - with Safari Technology Preview. As of November 2018 this will not work with stock Safari.)

What is a Theme?

You can think of a theme kinda like a mod for a video game. A mod doesn't define the gameplay or the characters, its only a tweak. Bu

Using .Net Core and SQL to build User Authentication

(this might not work how I want, WIP)

From : https://www.c-sharpcorner.com/article/configure-sql-server-session-state-in-asp-net-core/

Project.json

"tools": {  
 "Microsoft.Extensions.Caching.SqlConfig.Tools": "1.0.0-preview2-final"

Setup Angular CLI on MacOS

I thought it was supposed to be easy! Well it is after I did a little digging.

Install tools

Download and Install

NodeJS (8)
NVM
VS Code

	/*!
	* Bootstrap Grid v4.0.0 (https://getbootstrap.com)
	* Copyright 2011-2018 The Bootstrap Authors
	* Copyright 2011-2018 Twitter, Inc.
	* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
	* Simplified by DevEarley - 2018
	*/

	/* Tweak here */
	$xs: 0;

	import { Component, OnInit } from '@angular/core';
	import { ActivatedRoute } from '@angular/router';
	import { Marked } from 'marked-ts';
	import { highlight } from 'highlight.js';

	@Component({
	selector: 'app-doc',
	template: `
	<div id="content-container" class="doc" [innerHTML]="markdownHTML" ></div>' `
	})

	import { Injectable } from '@angular/core';
	import { Router } from '@angular/router';
	import * as FileSaver from "file-saver";

	@Injectable({
	providedIn: 'root'
	})
	export class FileService {

	constructor() { }

	namespace App
	{
	public class FileReader
	{
	private List<FolderModel> GetFoldersForDocs()
	{
	DirectoryInfo di = new DirectoryInfo(documentationPath);
	FileInfo[] files = RecursiveFetch(4, di.FullName);
	var trimLength = di.FullName.Count();
	var folders = files.Select(x => BuildFileModel(x, trimLength))

	namespace App
	{
	public class FileWriter
	{
	public void WriteFile(string filename, string content)
	{
	var path = "C:/Temp/" + filename;
	var file = System.IO.File.Create(path);
	var writer = new System.IO.StreamWriter(file);
	writer.WriteLine(content);