Collection of git-tips, want to add your tips? Checkout contributing.md

English | 中文 | Русский | 한국어 | Tiếng Việt | 日本語 | नेपाली | Polski | فارسی

• git-tip - A handy CLI to make optimum use of these tips. (Here in Docker container)

P.S: All these commands are tested on git version 2.7.4 (Apple Git-66).

• Everyday Git in twenty commands or so
• Show helpful guides that come with Git
• Search change by content
• Show changes over time for specific file
• Remove sensitive data from history, after a push
• Sync with remote, overwrite local changes
• List of all files till a commit
• Git reset first commit
• Reset: preserve uncommitted local changes
• List all the conflicted files
• List of all files changed in a commit
• Unstaged changes since last commit
• Changes staged for commit
• Show both staged and unstaged changes
• List all branches that are…

This command line interface enables you to package your Node.js project into an executable that can be run even on devices without Node.js installed.

• Make a commercial version of your application without sources
• Make a demo/evaluation/trial version of your app without sources
• Instantly make executables for other platforms (cross-compilation)
• Make some kind of self-extracting archive or installer
• No need to install Node.js and npm to run the packaged application
• No need to download hundreds of files via npm install to deploy your application. Deploy it as a single file
• Put your assets…

React & Redux in TypeScript - Complete Guide

"This guide is a living compendium documenting the most important patterns and recipes on how to use React (and its Ecosystem) in a functional style using TypeScript. It will help you make your code completely type-safe while focusing on inferring the types from implementation so there is less noise coming from excessive type annotations and it's easier to write and maintain correct types in the long run."

Found it useful? Want more updates?

Show your support by giving a ⭐

---

What's new?

🎉 Now updated to support TypeScript v4.6 🎉 🚀 _Updated to typesafe-actions@5.x 🚀

---

• Complete type safety (with --strict flag) without losing type information downstream through all the layers of our application (e.g. no type assertions or hacking with any type)
• Make type annotations concise by eliminating redundancy in types using advanced TypeScript Language features like Type Inference and…

Welcome to React Kawaii! This repository contains both the website and the React package.

React Kawaii is an open source library of cute SVG illustrations. Perfect if you want to give some cuteness to your React App.

The website for React Kawaii is located in the apps/website directory. It serves as a documentation hub and may also include demos, tutorials, and other resources related to the project.

To start the website locally:

1. Navigate to the apps/website directory.
2. Install dependencies with pnpm install.
3. Run the development server with pnpm start.

The React package, named react-kawaii, is located in the packages/react-kawaii directory. It contains the source code for the React components.

To use the react-kawaii package in your projects:

1. Install it from npm or yarn:

   npm install --save react-kawaii
   

   or

   yarn add react-kawaii
   

2. Import the components you need in your React application:

   import

   …

Drop-in replacement for the textarea component which automatically resizes textarea as content changes. A native React version of the popular jQuery Autosize! Weighs around 1.3KB (minified & gzipped).

This module supports IE9 and above.

import TextareaAutosize from 'react-textarea-autosize';

// If you use CommonJS syntax:
// var TextareaAutosize = require('react-textarea-autosize').default;

React.renderComponent(
  <div>
    <TextareaAutosize />
  </div>,
  document.getElementById('element'),
);

npm install react-textarea-autosize

https://andarist.github.io/react-textarea-autosize/

Content-aware image resizer

• ▶️ ️Demo
• ✏️ How it works
• 📄 Seam carving paper by Shai Avidan and Ariel Shamir

Background image by Ian Dooley

Content-aware image resizing might be applied when it comes to changing the image proportions (i.e. reducing the width while keeping the height) and when losing some parts of the image is not desirable. Doing the straightforward image scaling in this case would distort the objects in it. To preserve the proportions of the object while changing the image proportions we may use the Seam Carving algorithm.

In the example below, you may see how the original image width was reduced by 50% using content-aware resizing (left image) and straightforward scaling (right image). In this particular case, the left image looks more natural since the proportions of the balloons were preserved.

The Seam Carving algorithm’s idea is to find the…

Deno is a simple, modern and secure runtime for JavaScript and TypeScript that uses V8 and is built in Rust.

This list is a collection of the best Deno modules and resources.

• Docs
  • Official Docs
  • External Docs
  • Online Playgrounds
• Modules
  • Automation
  • CLI utils
  • Cloud APIs
  • Database
  • Editor framework
  • Frontend development
  • Frontend framework
  • Game engine
  • LLM
  • Logging
  • Machine Learning
  • Mail
  • Markdown
  • Math
  • Static site generator
  • String utils
  • Social Platform APIs
  • Template engine
  • Testing
  • Utils
  • Web framework
  • WebSocket
  • Web utils
  • Webview
  • XML
• Registries
• Showcases
• Tools
• Integrations
• Articles
• Blogs/Newsletters
• Presentations
• Resources
  • Books
• Resources in Other Languages
  • Chinese
  • Hebrew
  • Indonesian
  • Italian
  • Japanese
  • Korean
  • Russian
  • Spanish
  • Darija (Arabe marocain)
  • Kurdish (Central)

• Official Site
• Deno Manual
• Deno API Reference
• Deno Standard Modules

• V8 Docs for Deno

• Deno Starter in Codesandbox
• myCompiler.io
• Repl.it

• autopilot - Autopilot - Cross-platform web automation with Deno.
• swissknife - SwissKnife…

howler.js is an audio library for the modern web. It defaults to Web Audio API and falls back to HTML5 Audio. This makes working with audio in JavaScript easy and reliable across all platforms.

Additional information, live demos and a user showcase are available at howlerjs.com.

Follow on Twitter for howler.js and development-related discussion: @GoldFireStudios.

• Single API for all audio needs
• Defaults to Web Audio API and falls back to HTML5 Audio
• Handles edge cases and bugs across environments
• Supports all codecs for full cross-browser support
• Automatic caching for improved performance
• Control sounds individually, in groups or globally
• Playback of multiple sounds at once
• Easy sound sprite definition and playback
• Full control for fading, rate, seek, volume, etc.
• Easily add 3D spatial sound or stereo panning
• Modular - use what you want and easy to extend
• No outside dependencies, just pure JavaScript
• As light as…

Installation • Usage • Contributing

The library is written in TypeScript and compiled to an UMD module to allow integration into different environments.

You can grab the latest version from jsdelivr.

<script src="https://cdn.jsdelivr.net/npm/party-js@latest/bundle/party.min.js"></script>

The library instance is loaded into the global party object.

If you are using a package-managed environment, you can also install the latest version via npm.

npm install party-js
# or
yarn add party-js

To use it, simply require or import it.

import party from "party-js";
// or
const party = require("party-js");

The library essentially offers a fully customizeable particle-system implementation into HTML documents. Users of the library have the ability to create and fine-tune effects to their individual liking. The library offers a few simple effects right out-of-the-box, so you don't have to waste time re-creating simple…

CHOC is acronym for Chakra Higher Order Components. Choc UI is a collection of components, inspired by many sources of well used web components, which are rebuilt based on the Chakra UI library.

See it in action on Choc-UI's Website.

• Elements
  • Headers
  • Cards
  • Alerts
  • Pagination
  • Badges
  • Gradient Icons
  • Carousels
  • Empty - Antd, https://readyui.co, razorui.com
  • Result - Antd
  • Extra Components
• Page Sections
  • Heros
  • Feature Sections
  • CTA Sections
  • Pricing Sections
  • Client Sections - WickedBlocks
  • Content Sections
  • FAQs
  • Newsletter Sections
  • Stats - Kutty, TailwindUI
  • Testimonials
  • Blog Sections -
  • Contact Sections
  • Footers - Meraki UI
  • Logo Clouds
• Navigation - TailwindUI, Meraki UI
  • Navbars
  • Vertical Navigation (Menus)
  • Sidebar Navigation
• Headings - TailwindUI
  • Card Headings
  • Section Headings
  • Page Headings
• Example Pages - Meraki UI, Kutty
  • Landing Pages
  • Contact Pages
  • Error Pages
  • Home Screens
  • Detail Screens
  • Settings Screens
• Forms Tailwind
  • Form Layouts - Tailwind
  • Sign in and Registration - WickedBlocks
• …