Skip to content

Instantly share code, notes, and snippets.

Avatar
💭
👨🏻‍🍳 helping you cook better apps

Younes Jaaidi yjaaidi

💭
👨🏻‍🍳 helping you cook better apps
View GitHub Profile
@yjaaidi
yjaaidi / switch-map-on-next.js
Created Sep 2, 2022
switchMapOnNext rxjs operator
View switch-map-on-next.js
import * as rx from 'rxjs';
const delays = [3000, 2000, 500];
const switchMapOnNext = (project) => (source) => {
return new rx.Observable((observer) => {
let previousSubs = new rx.Subscription();
const subscription = source.subscribe((value) => {
const result$ = project(value);
const currentPreviousSubs = previousSubs;
View ngx-light-hello.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>👨🏻‍🍳🅰️ Ngx Light by Younes @ Marmicode.io</title>
<meta name="description" content="👨🏻‍🍳🅰️ Ngx Light" />
<meta name="viewport" content="width=device-width,initial-scale=1" />
<script type="importmap">
{
"imports": {
@yjaaidi
yjaaidi / ngx-light.html
Last active Jun 11, 2022
Tiniest Angular Setup Ever
View ngx-light.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>👨🏻‍🍳🅰️ Ngx Light by Younes @ Marmicode.io</title>
<meta name="description" content="👨🏻‍🍳🅰️ Ngx Light" />
<meta name="viewport" content="width=device-width,initial-scale=1" />
<script type="importmap">
{
"imports": {
View wait-latest-from.ts
import { switchMap } from 'rxjs/operators';
action$;
state$; // facade.country$ etc...
repository$;
fetch$.pipe(withLatestFrom(facade.country$));
waitLatestFrom = (action$) =>
action$.pipe(
@yjaaidi
yjaaidi / storybook-custom-elements-reload-hack.js
Created Jan 8, 2021
Storybook Angular Custom Elements reload hack
View storybook-custom-elements-reload-hack.js
/**
* @hack detect when story is changed and reload because custom elements
* break HMR.
* Storybook will replace storybook-dynamic-app-root's children.
* Then we reload the page to redefine elements.
*/
const rootEl = document.querySelector('#root');
rootEl.addEventListener('DOMNodeRemoved', (evt) => {
if (evt.relatedNode === rootEl) {
document.location.reload();
@yjaaidi
yjaaidi / prototype-pollution.js
Created Oct 2, 2019
Prototype pollution example
View prototype-pollution.js
const u1 = {firstName: 'Foo'}
const u2 = {firstName: 'John'}
const body = JSON.parse('{"__proto__": {"admin": true}}')
function vulnerableExtend(dst, src) {
Object.entries(src)
.forEach(([k, v]) => {
if (k in dst) {
vulnerableExtend(dst[k], src[k]);
View views-sandwich-sandwich-views.module.ts
@NgModule({
imports: [
RoutingModule.forChild([
{
path: 'catalog',
# Or, you can lazy load catalog if you wish.
component: SandwichCatalogViewComponent
}
]),
SandwichCatalogViewModule
View views-app-routing.module.ts
@NgModule({
imports: [
RoutingModule.forRoot([
{
path: 'sandwich',
loadChildren: './sandwich/sandwich-views.module#SandwichViewsModule'
}
])
]
})
View ng-vdom-example.ts
@Component({
template: ``
})
export class AppComponent extends Renderable {
render() {
return (
<h1>Hello World!</h1>
)
}
}
View angular-tagged-template.ts
/**
* @todo when `deps` will be added to `Component` definition,
* we could return `{deps, template}` then use it like this:
* ```
* @Component({
* selector: 'wt-root',
* ...ngTemplate`<${Child}></${Child}>`
* })
* ```