Skip to content

Instantly share code, notes, and snippets.

View lrsbt's full-sized avatar

Lars lrsbt

  • LarsAttacks
  • London
View GitHub Profile
@rousan
rousan / README.md
Created July 17, 2021 14:29
How to add .service file in Ubuntu?

How to add .service file in Ubuntu?

  1. Write the my-server.service file name with the following content:
[Unit]
Description=Some description about the app.

[Service]
User=www-data
@ChronSyn
ChronSyn / babel.config.js
Last active December 19, 2024 10:44
Expo - Alias path example
module.exports = function (api) {
api.cache(true);
return {
presets: ['babel-preset-expo'],
plugins: [
["@babel/plugin-transform-flow-strip-types"],
["@babel/plugin-proposal-decorators", { "legacy": true }],
["@babel/plugin-proposal-class-properties", { "loose": true }],
["module-resolver", {
"alias": {
@aranda-adapptor
aranda-adapptor / App.tsx
Last active April 24, 2023 10:27
Starfield in Reanimated 2 - adding animation 1
import React, { useEffect } from "react";
import { View } from "react-native";
// Import the required types from Reanimated
import Animated, {
Easing,
useAnimatedStyle,
useSharedValue,
withRepeat,
withTiming,
} from "react-native-reanimated";
@ItsJonQ
ItsJonQ / interpolate.js
Last active February 21, 2025 15:28
interpolate.js
/**
* Modified from:
* https://github.com/react-spring/react-spring/blob/master/src/animated/createInterpolator.ts
*/
function clamp(value, min, max) {
return Math.max(min, Math.min(max, value));
}
export function findRange(input, inputRange) {
@pablomayobre
pablomayobre / useAnimationFrame.js
Created March 2, 2020 20:38
useAnimationFrame React Hook, for requestAnimationFrame, with Delta Time and no re-rendering. Uses useLayoutEffect so it can be used before the canvas has been rendered to screen,
import { useState, useRef, useLayoutEffect } from "react";
const useAnimationFrame = (callback) => {
const callbackRef = useRef(callback);
const frameRef = useRef();
const timerRef = useRef();
useLayoutEffect(() => {
callbackRef.current = callback;
}, [callback]);
@pedroraft
pedroraft / ZoomableImage.tsx
Last active March 7, 2020 20:17
ZoomableImage
import React from 'react'
import { Animated, Image, StyleSheet, ImageSourcePropType } from 'react-native'
import {
PinchGestureHandler,
PinchGestureHandlerStateChangeEvent,
State,
} from 'react-native-gesture-handler'
import { Container } from '../ui'
import Colors from '../../constants/Colors'
@aolufisayo
aolufisayo / rn_gesture.js
Created August 5, 2019 12:03
React Native Gesture Blurview Drawer
// This SNACK is a follow up of this tweet:
// https://twitter.com/MengTo/status/1142539362875392001
// I just wanted to recreate it using React Native ❤️
// Take the code as it is, I'll not refactor it -> unnecessary effort
import React, { Component } from 'react';
import {
TouchableOpacity,
StatusBar,
Text,
ImageBackground,
@nathaniel-miller
nathaniel-miller / linting.md
Created July 7, 2019 03:17
VSCode, ESLint, Prettier, Husky Setup

This is a giant pain in the ass to get working correctly and consistently. Even when it does work, often trying to replicate it in another repository or workspace the setting's don't always seem to work.

I can at times entirely remove my .eslintrcand vscode will still go on its merry way, linting from some mysterious ghost rules. On other occasions things will be great and then, after restarting vscode, I'll be told my imports are invalid (they are not).

As a matter of fact, as I sat down to write this I couldn't get it to linting/format according to my rules. Eventually I reinstalled my node packages with npm install and tried to commit a poorly formatted file (which thankfully failed). That seemed to finally kick something (not sure what) in the pants and linting began to function correctly. But literally, I've spent days getting this sorted out.

Anyway, here's my current setup.

VSCODE SETTINGS

In either ~/.config/Code/User/settings.json or myworkspace.code-workspace:

@kmagiera
kmagiera / reanimated.js
Created March 7, 2018 13:37
Snappable component sample implementation based on new Animated API
import React, { Component } from 'react';
import { StyleSheet, View } from 'react-native';
import { PanGestureHandler, State } from 'react-native-gesture-handler';
import Animated from 'react-native-reanimated';
class Snappable extends Component {
constructor(props) {
super(props);
@mfd
mfd / GTWalsheimPro.css
Last active February 22, 2025 13:50
GT Walsheim Pro
@font-face {
font-family: GT Walsheim Pro;
src: local("GT Walsheim Pro Regular"),local("GTWalsheimProRegular"),url(GTWalsheimProRegular.woff2) format("woff2"),url(GTWalsheimProRegular.woff) format("woff"),url(GTWalsheimProRegular.ttf) format("truetype");
font-weight: 400;
font-style: normal
}
@font-face {
font-family: GT Walsheim Pro;
src: local("GT Walsheim Pro Bold"),local("GTWalsheimProBold"),url(GTWalsheimProBold.woff2) format("woff2"),url(GTWalsheimProBold.woff) format("woff"),url(GTWalsheimProBold.ttf) format("truetype");