| import { Directive, EventEmitter, HostBinding, HostListener, Input, Output } from '@angular/core'; | |
| // Angular Drag and Drop File | |
| // | |
| // Add this directive to an element to turn it into a dropzone | |
| // for drag and drop of files. | |
| // Example: | |
| // | |
| // <div (appDropZone)="onDrop($event)"></div> | |
| // |
| Possible approaches to rendering web components on the server... | |
| Server side DOM library (JSDOM alternative) that supports custom elements: | |
| https://www.npmjs.com/package/happy-dom | |
| https://medium.com/@treshugart/%C3%A5server-side-rendering-web-components-e5df705f3f48 | |
| Approach is based on this zip: | |
| https://gist.github.com/justinfagnani/936791248120749ff1f8188f1f4064d9 | |
| Share a template between client side code and server side code: |
| import { Pipe, PipeTransform } from '@angular/core'; | |
| @Pipe({ | |
| name: 'duration' | |
| }) | |
| export class DurationPipe implements PipeTransform { | |
| transform(value: string): string { | |
| const leftPad = x => String(x).length >= 2 ? x : leftPad(`0${x}`); | |
| const [ _, hours, mins, secs ] = value.match(/PT(?:(\d+)H)?(?:(\d+)M)?(?:(\d+)S)?/); | |
| return [hours || 0, mins || 0, secs || 0].map(leftPad).join(':'); |
First I run the ng new command:
ng new --minimal --style=css --routing project-name
I use the minimal option as I like to start with the bare minimum and then add back in what I need. I then open this in my IDE of choice. I currently use IntelliJ IDEA.
The first thing I do is open the CLI config angular.json and make a few changes.
First I make sure that the schematics are configured to create inline template and styles.
| #!/bin/bash | |
| docker run --name fc \ | |
| -v $PWD/ssl:/etc/nginx/certs \ | |
| -v $PWD/ssl/nginx-default.conf:/etc/nginx/conf.d/default.conf:ro \ | |
| -v $PWD/dist/___PROJECT_NAME___:/usr/share/nginx/html:ro -p 8080:443 -d nginx |
| #pragma once | |
| #include "unit2.h" | |
| template <typename Type> | |
| class CustomOscillator | |
| { | |
| public: | |
| CustomOscillator() = default; |
| const validChars = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789'; | |
| let array = new Uint8Array(40); | |
| window.crypto.getRandomValues(array); | |
| array = array.map(x => validChars.charCodeAt(x % validChars.length)); | |
| const randomState = String.fromCharCode.apply(null, array); | |
| console.log(randomState); |
| # Steps for renaming your master branch to 'main' | |
| # Adapted from | |
| # https://dev.to/rhymu8354/git-renaming-the-master-branch-137b | |
| # https://www.hanselman.com/blog/EasilyRenameYourGitDefaultBranchFromMasterToMain.aspx | |
| #---------------------------------------------------------------------------------------------# | |
| # A) - Steps if you have no remote / upstream | |
| # B) - Steps if you are the repo owner and have a remote / upstream | |
| # C) - Steps if you are using a repo where the upstream main branch has been renamed |
| toPairs(data.employees)[*].merge([1], { | |
| id: [0], | |
| fullName: join(' ', [[1].firstname, [1].surname]), | |
| reverseName: join(', ', [[1].surname, [1].firstname]), | |
| reportsTo: [1].manager && merge(get($.data.employees, [1].manager), { id: [1].manager }) | |
| }) |
| [{"blocks":[{"type":"init"},{"type":"gsheet","simple":true,"key":"https://docs.google.com/spreadsheets/d/1YIQCavPvOzTArBc1d2dlbP3bhHVHI65o3-AEHp_urXA/"},{"type":"grid","gridOptions":{}}],"id":"artWillList","workflowId":"artWillList","adapterName":"culturebanked","created":"2020-06-25T09:18:49.829Z","updated":"2020-06-25T09:18:49.829Z","modified":"2020-06-25T09:18:49.829Z","title":"Art"},{"blocks":[{"type":"form","jsonSchema":{"type":"object","properties":{"asset":{"type":"string","title":"Asset"},"width":{"type":"number","title":"Width (mm)"},"height":{"type":"number","title":"Height (mm)"},"medium":{"type":"string","title":"Medium"},"after":{"type":"string","title":"After"},"location":{"type":"string","title":"Location"},"owner":{"title":"Owner","type":"object","properties":{"name":{"type":"string","title":"Name"},"split":{"type":"number","title":"Split"}}},"beneficiaries":{"title":"Beneficiaries","type":"array","items":{"type":"object","properties":{"name":{"type":"string","title":"Name"},"split":{"type":"n |