ahmadrosid

import type { ConfigData, Conversation } from '@/Components/ChatWidget';
import { ChatWidget } from '@/Components/ChatWidget';
import useConfigReducer from '@/Hooks/useConfigReducer';

import DialogModal from '@/Components/DialogModal';
import InputLabel from '@/Components/InputLabel';
import Popover from '@/Components/Popover';
import PrimaryButton from '@/Components/PrimaryButton';
import TextInput from '@/Components/TextInput';
import useRoute from '@/Hooks/useRoute';

ahmadrosid

Glowing Button

Demo on code sandbox: https://codesandbox.io/s/gracious-button-22ylg9

Demo

ahmadrosid

HTML:

<div class="grid place-content-center h-screen">
  <button class="text-white relative inline-flex items-center gap-3 overflow-hidden rounded-[12px] p-2 ring-2 ring-base before:absolute before:inset-[2px] before:rounded-[10px] shadow-inside bg-btn">
    <span class="z-10">

ahmadrosid

NodeJS Fork vs Cluster

Halo temen-temen sematan di channel program-ajamanau.

Di video kali ini saya mau bahas tentang Node.js fork versus cluster.

Jadi video ini saya buat dari pertanyaan dari JD News.

Jadi disana bertanya tentang perbedaan fork dan juga cluster di Node.js dan fungsinya untuk apa.

ahmadrosid

ahmadrosid

<div class="d-flex flex-column flex-shrink-0 p-3 text-bg-dark" style="width: 280px;">
    <a href="/" class="d-flex align-items-center mb-3 mb-md-0 me-md-auto text-white text-decoration-none">
      <svg class="bi pe-none me-2" width="40" height="32"><use xlink:href="#bootstrap"></use></svg>
      <span class="fs-4">Sidebar</span>
    </a>
    <hr>
    <ul class="nav nav-pills flex-column mb-auto">
      <li class="nav-item">
        <a href="#" class="nav-link active" aria-current="page">
          <svg class="bi pe-none me-2" width="16" height="16"><use xlink:href="#home"></use></svg>

ahmadrosid

<div className="max-w-3xl mx-auto px-2 py-4">
  <button type="button" className="inline-flex items-center px-4 py-2 leading-6 text-sm text-gpt-100 transition ease-in-out duration-150" disabled="">
    <svg className="animate-spin -ml-1 mr-3 h-5 w-5 text-white" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24">
      <circle className="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" strokeWidth="4"></circle>
      <path className="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path>
    </svg>
    Loading...
  </button>
</div>

ahmadrosid

import { Clipboard } from "lucide-react";
import { useState } from "react";
import ReactMarkdown from "react-markdown";
import { Prism as SyntaxHighlighter } from "react-syntax-highlighter";
import dark from "../theme/dark";

export default function Markdown({ markdown }) {
  return (
    <ReactMarkdown
      children={markdown}

ahmadrosid

{
  100: '#F0F3FF',
  300: '#7D8398',
  400: '#565868',
  500: '#444753',
  600: '#40414E',
  700: '#343540',
  800: '#202123',
}

ahmadrosid

import { nord as base } from "react-syntax-highlighter/dist/esm/styles/prism";

/** @type { React.CSSProperties } */
let baseBg = {
  borderRadius: "0",
  margin: "0",
  background: "transparent",
  overflow: "hidden",
  textAlign: "left",
  whiteSpace: "pre",