Skip to content

Instantly share code, notes, and snippets.

View CharGrnmn's full-sized avatar

Charlie Greenman CharGrnmn

View GitHub Profile
sudo rm -rf /usr/local/{lib/node{,/.npm,_modules},bin,share/man}/{npm*,node*,man1/node*}
@CharGrnmn
CharGrnmn / list-of-architecture-articles.txt
Last active July 4, 2016 18:04
Articles relating to front end architecture
Self Documenting Javascript
https://www.sitepoint.com/self-documenting-javascript/
@CharGrnmn
CharGrnmn / front-end-build.txt
Created July 4, 2016 18:10
What constitutes a complete front end build system?
A good front end build system can consist of various different things.
However, I think it can be agreed upon that at it’s core, there are important core features.
1. Run time
2. Tree shaking
3. Hot reloading
4. Minification
5. Compilation Time
6. Introduction of new module to core build system
7. Package management
grid-form
├── src
│ └── lib
│ │ ├── services
│ │ │ ├── grid-form.service.ts
│ │ │ └── grid-form.service.spec.ts
│ │ ├── graphql
│ │ │ ├── grid-form.fragments.ts
│ │ │ ├── grid-form.queries.ts
│ │ │ └── grid-form.mutations.ts
@CharGrnmn
CharGrnmn / gist:cab57a5a22c22508d43809de806b0bfd
Created November 13, 2018 21:57
Find and replace text using bash
# On mac:
git grep -l 'original_text' | xargs sed -i '' -e 's/original_text/new_text/g'
# On linux
git grep -l 'original_text' | xargs sed -i 's/original_text/new_text/g'
@CharGrnmn
CharGrnmn / gist:7ee85c5c340c20757434f86297ab828f
Last active March 31, 2019 16:44
Data Access Directory Structure
libs
├── px-illustrator/
│ ├── data-access/
│ │ ├── code-box/
│ │ │ ├── src/
│ │ │ │ ├── lib/
│ │ │ │ ├── +state
│ │ │ │ ├── code-box.actions.ts,file]
│ │ │ │ ├── code-box.adapter.ts,file]
│ │ │ │ ├── code-box.effects.spec.ts,file]
@CharGrnmn
CharGrnmn / app.module.ts
Created June 13, 2019 23:54
Example of an Angular router.
import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router';
import { AppComponent } from './app.component';
@NgModule({
imports: [
RouterModule.forRoot( [
{
path: '',
component: AppComponent
@CharGrnmn
CharGrnmn / gist:199e4265187e616a5c012513058e3c46
Last active July 9, 2019 14:09
Angular Material Color Generator
export function getColorObject(value, name) {
var c = tinycolor(value);
return {
name: name,
hex: c.toHexString(),
darkContrast: c.isLight()
};
}
export function calculateMaterialPalette(hex) {
@CharGrnmn
CharGrnmn / _themes.scss
Created July 12, 2019 13:25
mat-green Color Map
$mat-green: (
50: #e8f5e9,
100: #c8e6c9,
200: #a5d6a7,
300: #81c784,
400: #66bb6a,
500: #4caf50,
600: #43a047,
700: #388e3c,
800: #2e7d32,
@CharGrnmn
CharGrnmn / _themes.scss
Created July 12, 2019 13:52
Angular Material Sass Light Theme Function
@function mat-light-theme($primary, $accent, $warn: mat-palette($mat-red)) {
@return (
primary: $primary,
accent: $accent,
warn: $warn,
is-dark: false,
foreground: $mat-light-theme-foreground,
background: $mat-light-theme-background,
);
}