Skip to content

Instantly share code, notes, and snippets.

@1isten
1isten / web.php
Last active January 22, 2024 11:36
laravel route serve static
<?php
// Route::get('/', ...
// ...
Route::fallback(function () {
$static = 'static'; // static folder in project root
$static_file = request()->path() === '/' ? base_path($static) : implode(DIRECTORY_SEPARATOR, array_merge(array(base_path($static)), explode('/', request()->path())));
if (is_dir($static_file)) {
@1isten
1isten / frontend_framework_essentials.md
Last active January 27, 2023 01:52
basic learning path for any frontend (js) framework
  1. template attributes vue, react
  2. template css & style vue, react
  3. template syntax (condition & list rendering) vue, react
  4. element ref vue, react
  5. form, input events & data binding vue, react
  6. component props (top-down) vue, react
  7. component events (bottom-up) vue,
@1isten
1isten / closure.md
Last active January 3, 2022 04:07
JavaScript Closures made easy ;P

Three JS key concepts:

  1. Functions can be nested: a child function inside a parent function (and can be returned by the parent function).

  2. Lexical scope: variables from outter scope are available to inner functions (when these inner functions are created).

  3. Variables which can be accessed by any function anyhow will never be garbage collected (until that function is garbage collected).

A "closure" is a place (scope) where those variables are stored at and is only available for that function who needs to access them. Except for that function, there is no other API to access/modify those variables in the closure.

@1isten
1isten / nuxtjs_v2+nestjs.md
Last active January 23, 2023 02:28
Nuxt + Next: run Next.js as a server (connect) middleware on Nuxt.js (v2)
  1. Do not start Nest server, instead, just export an async function which returns its initialized app instance:
// path/to/nest/src/main.ts

import { NestFactory } from '@nestjs/core';
import { ExpressAdapter, NestExpressApplication } from '@nestjs/platform-express'; // Optional because the `@nestjs/platform-express` package is used by default
import { AppModule } from './app.module';

async function bootstrap() {
@1isten
1isten / valet_nginx_custom_config.md
Last active February 1, 2021 15:59
Homebrew nginx (Valet version) with custom config:

In /usr/local/etc/nginx/nginx.conf (default config), Valet has included these lines:

# ...

    include "/Users/sten/.config/valet/Nginx/*";
    include servers/*; # 👈
    include valet/valet.conf;

# ...
@1isten
1isten / homebrew_install_mariadb.md
Created January 5, 2021 16:24
fix default (localhost only) user cannot connect via 127.0.0.1

uninstall if necessary

brew services stop mariadb
brew uninstall mariadb
rm -rf /usr/local/var/mysql /usr/local/etc/my.cnf # be sure to backup first

(re)install

brew install mariadb
@1isten
1isten / compress-base64-imgs.js
Last active December 17, 2020 09:47
js compress image (base64) using canvas api
const toBase64 = (file) => new Promise((resolve, reject) => {
const reader = new FileReader();
reader.readAsDataURL(file);
reader.onload = (e) => resolve(e.target.result);
reader.onerror = (err) => reject(err);
});
const compressBase64 = (src, quality = 0.5) => new Promise((resolve) => {
const img = new Image();
img.src = src;
@1isten
1isten / forEach-break-continue-await.js
Created June 10, 2020 15:03
forEach does not support break or continue, each iteration involves a new callback
(async function () {
const arr = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
// SyntaxError: Illegal break statement
arr.forEach(n => {
if (n === 3) {
break;
}
console.log(n);
});
@1isten
1isten / md-colors.js
Last active May 4, 2020 18:13
2014 Material Design color palettes in JS object format
// https://material.io/guidelines/style/color.html
module.exports = {
'red': {
'50': '#ffebee',
'100': '#ffcdd2',
'200': '#ef9a9a',
'300': '#e57373',
'400': '#ef5350',
'500': '#f44336',
@1isten
1isten / rFetch.js
Created January 14, 2020 13:41
recursively fetch Laravel paginated api
function rFetch(url) {
return new Promise((resolve, reject) => {
const list = [];
const getData = async url => {
try {
await new Promise((resolve, reject) => {
setTimeout(() => resolve(), 1000); // force delay~
});
const { data } = await axios.get(url);
console.log(data.current_page);