yann-yinn

/**
 * Usage in a component:
 * 
 * import useApiRequest from "@/composables/useApiRequest"
 * 
 * const saveRequest = useApiRequest("https://jsonplaceholder.typicode.com/userse");
 * function handleFormSubmit() {
 *   saveRequest.execute()
 * }
 */

yann-yinn

<script setup lang="ts">
import { ref, watch, watchEffect } from "vue";

const price = ref(10);
const quantity = ref(1);

watchEffect(() => {
  console.log("watchEffect()", price.value, quantity.value);
});

yann-yinn

import React, { useState, useEffect } from "react";
import ReactDOM from "react-dom";
import axios from "axios";

export default function App() {
  const [users, setUsers] = useState(null);

  useEffect(async () => {
    const result = await axios("https://gorest.co.in/public-api/users");
    setUsers(result.data.data);

yann-yinn

import React from "react";
import {
  BrowserRouter as Router,
  Switch,
  Route,
  Link
} from "react-router-dom";

export default function App() {
  return (

yann-yinn

const { MongoClient } = require("mongodb");

let db;

const client = new MongoClient(process.env.MONGO_URL, {
  useNewUrlParser: true,
  useUnifiedTopology: true,
});

module.exports = {

yann-yinn

async function graphql({ query, variables }) {
  let response = await fetch(process.env.FIREBLOG_GRAPHQL_ENDPOINT, {
    method: "POST",
    headers: {
      "Content-Type": "application/json",
      Accept: "application/json",
    },
    body: JSON.stringify({
      query,
      variables,

yann-yinn

const crypto = require("crypto");
const algorithm = "aes-256-cbc";
const secretKey = "SECRET_KEY_32_CHARS";

module.exports = {
  encrypt,
  decrypt,
};

// https://attacomsian.com/blog/nodejs-encrypt-decrypt-data

yann-yinn

<div 
     class="space-y-1" 
     x-data="Components.select({links: [<%= all_items_links %>], value: <%= selected_index %>, selected: <%= selected_index %> %>)" 
     x-init="init()">
  <% if hide_label %>
    <label 
           class="sr-only" 
           id="<%= random_id_prefix %>-listbox-label">
      <%= label %>
    </label>

yann-yinn

{
  postsCount(filter: { blog: { eq: "{{BLOG_ID}}" } })
  posts(
    limit: 20
    skip: 0
    filter: { blog: { eq: "{{BLOG_ID}}" } }
  ) {
    slug
    title
    teaser

yann-yinn

<template>
  <div id="app">
    <div v-if="loadingState === 'PENDING'">Loading ...</div>
    <div
      v-if="loadingState === 'FINISHED'"
      style="max-width: 700px; margin: auto"
    >
      <header style="margin-bottom: 40px; text-align: center">
        <h1>{{ blog.name }}</h1>
        <em>{{ blog.description }} </em>