Maria Bitsch mariabitsch

Frontend Development

Attention: the list was moved to

https://github.com/dypsilon/frontend-dev-bookmarks

This page is not maintained anymore, please update your bookmarks.

Encode SVG SCSS

A small function in response to Taylor Hunt's blog post "Optimizing svgs in data uris"* allowing you to skip base64 encoding and simply paste the SVG markup right in the CSS.

http://codepen.io/Tigt/blog/optimizing-svgs-in-data-uris

Forked from jakob-e's Pen Encode SVG SCSS.

A Pen by Max Dolgov on CodePen.

ChatGPT Plus Models Cheat Sheet

Model	Quota (Plus Subscription)	Typical Use Cases
GPT-4o	80 messages per 3 hours ([help][1])	Multimodal, high-quality conversational AI
o4-mini	300 messages per day ([help][2])	Coding, math/science problems, tool-based tasks
o4-mini-high	100 messages per day ([help][2])	Frequent, moderate-complexity tool-assisted work
o3	200 messages per week ([help][2])	General-purpose reason

Using Gemini CLI for Large Codebase Analysis

When analyzing large codebases or multiple files that might exceed context limits, use the Gemini CLI with its massive context window. Use gemini -p to leverage Google Gemini's large context capacity.

File and Directory Inclusion Syntax

Use the @ syntax to include files and directories in your Gemini prompts. The paths should be relative to WHERE you run the gemini command:

	zmq = require("zmq")
	fs = require("fs")

	var config = JSON.parse(fs.readFileSync(process.argv[2]))

	var connexion = "tcp://"+config.ip+":"
	var shell_conn = connexion+config.shell_port
	var pub_conn = connexion+config.iopub_port
	var hb_conn = connexion+config.hb_port

	<?xml version="1.0" encoding="UTF-8"?>
	<!DOCTYPE plist PUBLIC "-//Apple Computer//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
	<plist version="1.0">
	<dict>
	<key>gutterSettings</key>
	<dict>
	<key>background</key>
	<string>#FFFFFF</string>
	<key>divider</key>
	<string>#000000</string>

	var pureRender = (Component) => {
	Object.assign(Component.prototype, {
	shouldComponentUpdate (nextProps, nextState) {
	return !shallowEqual(this.props, nextProps) \|\|
	!shallowEqual(this.state, nextState);
	}
	});
	};

	module.exports = pureRender;

	import React, { Component } from 'react'
	import Subapp from './subapp/Root'

	class BigApp extends Component {
	render() {
	return (
	<div>
	<Subapp />
	<Subapp />
	<Subapp />

	[ -s $HOME/.nvm/nvm.sh ] && . $HOME/.nvm/nvm.sh # This loads NVM

	function node {
	rawnode=$(which node)
	icu4cdata=$(dirname $(dirname $rawnode))/lib/node_modules/icu4c-data
	[[ -d $icu4cdata ]] \|\| npm install -g icu4c-data@$($rawnode -e '
	console.log((v => v.icu_ver_major + v.icu_endianness)(
	process.config.variables));')
	NODE_ICU_DATA=$icu4cdata $rawnode "$@"
	}

	import React from 'react';

	const MIN_SCALE = 1;
	const MAX_SCALE = 4;
	const SETTLE_RANGE = 0.001;
	const ADDITIONAL_LIMIT = 0.2;
	const DOUBLE_TAP_THRESHOLD = 300;
	const ANIMATION_SPEED = 0.04;
	const RESET_ANIMATION_SPEED = 0.08;
	const INITIAL_X = 0;