tanvirraj

import React from 'react';
import clsx from 'clsx';
import becomeALugger from '@/public/images/luggers-small-01_2x.jpg';
import Image from 'next/image';
import { Button } from '@/components/ui/core/button';
import { Link } from '@/components/ui/core/link';
import { Box } from '@/components/ui/core/box';

export type BecomeALuggerProps = React.ComponentProps<'section'>;

tanvirraj

{
  "editor.fontFamily": "JetBrains Mono",
  "editor.fontSize": 14,
  "editor.fontLigatures": true,
  "editor.lineHeight": 1.4,

  // "editor.fontFamily": "Berkeley Mono",
  // "editor.fontSize": 15,
  // "editor.fontWeight": "400",
  // "editor.lineHeight": 1.4,

tanvirraj

export class Cache<T extends object, K> {
	items = new WeakMap<T, K>()

	get<P extends T>(item: P, cb: (item: P) => K) {
		if (!this.items.has(item)) {
			this.items.set(item, cb(item))
		}
		return this.items.get(item)!
	}

tanvirraj

{
  //"editor.fontFamily": "Dank mono",
  "editor.fontFamily": "JetBrains Mono",

  "editor.fontSize": 13,

  //"editor.fontFamily": "BerkeleyMonoTrial-Regular",
  "editor.letterSpacing": 0.5,

  //monalisa only

tanvirraj

import React from 'react'
import addDays from 'date-fns/add_days'
import isBefore from 'date-fns/is_before'
import isToday from 'date-fns/is_today'
import startOfDay from 'date-fns/start_of_day'
import differenceInCalendarMonths from 'date-fns/difference_in_calendar_months'

export default function useCalendar({
  date = new Date(),
  offset: userOffset = 0,

tanvirraj

// @flow

import React, { PureComponent } from "react";
import styles from "./Button.module.scss";
import cx from "classnames";
import { Link } from "react-router-dom";
import { Button as AntDesignButton } from "antd";
import { type Node } from "react";

/**

tanvirraj

The Rules of React

All libraries have subtle rules that you have to follow for them to work well. Often these are implied and undocumented rules that you have to learn as you go. This is an attempt to document the rules of React renders. Ideally a type system could enforce it.

What Functions Are "Pure"?

A number of methods in React are assumed to be "pure".

On classes that's the constructor, getDerivedStateFromProps, shouldComponentUpdate and render.

tanvirraj

function githubFirstCommitsPage() {
  let el = document.querySelector('.repository-content');
  let commits = el.querySelector('[aria-label^=Commits]');
  let base = commits.closest('a').href;
  let count = commits.previousElementSibling
    .textContent
    .trim()
    .replace(/[^\d\.\-]/g, "");
  count = count-36;
  let sha = el

tanvirraj

Make it real

Ideas are cheap. Make a prototype, sketch a CLI session, draw a wireframe. Discuss around concrete examples, not hand-waving abstractions. Don't say you did something, provide a URL that proves it.

Ship it

Nothing is real until it's being used by a real user. This doesn't mean you make a prototype in the morning and blog about it in the evening. It means you find one person you believe your product will help and try to get them to use it.

Do it with style

tanvirraj

{
  "id": 13,
  "created_at": "2021-11-15T12:43:07.000000Z",
  "reference_number": "21111500006",
  "internal_reference_number": null,
  "required_by_date": "2021-11-15T21:00:00.000000Z",
  "expiry_date": "2021-11-15T21:00:00.000000Z",
  "expired_at": null,
  "pay_term": 0,
  "pay_term_unit": "days",