bundle.min.js
in the turbowarp.sh
package through a NPM CDN (like jsdelivr) from the "Custom Extensions" tile.
Git: sr.ht/~reesericci/turbowarp.sh
NPM: www.npmjs.com/package/turbowarp.shPosts tagged with :npm:
bundle.min.js
in the turbowarp.sh
package through a NPM CDN (like jsdelivr) from the "Custom Extensions" tile.
Git: sr.ht/~reesericci/turbowarp.sh
NPM: www.npmjs.com/package/turbowarp.shnext build
• After that, I wrote the confetti code and implement it on a React :react: component but I also don't know any react so it didn't work :eggsdee:
• So I added the confetti code into the already existing PhotoGallery component! :yay: Everything looked good, but then I got this error: ReferenceError: document is not defined
:errors:
• To fix that, I run my code client side after watching a small tutorial and it ended up like this:
import Masonry from 'react-masonry-css' import styles from './PhotoGallery.module.scss' import { Nunito } from 'next/font/google' import { useEffect } from 'react' const nunito = Nunito({ weight: ['400', '800'], subsets: ['latin'] }) export function Button({ children, fontSize = '7rem', ...props }) { const handleClick = () => { import('js-confetti').then(({ default: Confetti }) => { const confetti = new Confetti() confetti.addConfetti({ emojis: ['🎮', '👾', '🕹️', '💻', '📸', '🎧', '🎨', '🪽'] }) }) } return ( <button className={styles.button} onClick={handleClick} {...props}> <span className={styles.shadow} /> <span className={styles.edge} /> <span style={{ fontSize }} className={`${styles.front} ${nunito.className}`}> {children} </span> </button> ) } function Image({ src, text }) { return ( <div className={styles.photo}> <img src={src} width="auto" /> <p>{text}</p> </div> ) } export default function PhotoGallery() { useEffect(() => {}, []) return ( <div className={styles.photoGallery}> <div className={styles.photos}>This was very fun to work with, and definitely I need to properly learn Next.js on the future. :salute:
npx create-mern-ts-next-app app
(Don't mind the crazy name lol [on a side note, I'm only slightly sure it works for everyone XD]). I was kinda bored in robotics class so I just cooked this up today. You can check out the code here:
github.com/KaiPereira/create-mern-app-kaipereira (for the executable) and here for the template: github.com/KaiPereira/template-for-create-mern-app.gitignore
file for this project!@purduehackers/time
version 0.1 is out, now featuring some basic docs and an overhauled api! while writing them i thought of a few more thing this package needs. will probably add those tomorrow. i want to start setting up an mdx blog soon & start writing a blog post about lightning time. hoping to do that asap this week, maybe when i'm back home.conflict
package name, because that just so happens to be what my almost finished framework is called, and the conflict
package has been empty for 3 years, now with a deprecation message of “lol” :peefest:npm link
, how to make exports like module/export
, and making cli tools with package.json’s binnpm i -g dialect-lang
and you can use dialup, the dialect compiler! OR visit raleighwi.se/dialect and run it in your browser :chrome:! You can write webapps with it, or just write code. It compiles down to :js: and I've built a basic stdlib. Feel free to ask questions on how to use it here :) Oh and also here's the source: github.com/l3gacyb3ta/dialectnpm install -g sidecast
npm install node-fetch@2.6.1
because I didn’t add a package.json.ankylos
(github.com/safinsingh/ankylos) a modular bootstrapper thing for node projects. Here's what it does:
1. Grab a preset to clone from. This will be copied to whatever destination you specify via a tarball from NPM
2. run ankylos bootstrap
to read from the ankylos.config.js
in the preset. this tells ankylos what plugins to install and configure. for example, the next
preset automatically installs and configures the 'editorconfig', 'eslint', 'github', 'husky', 'markdownlint', 'pnpm', 'prettier', 'renovate', and 'vscode'
plugins. it'll also send instructions for build scripts to set, dependencies, etc. ankylos
will take care of the explicit dependencies in the preset first. then, it'll install your plugins (ive made like 10 of them for convenience) and install your plugin's dependencies (these are stages 1 & 2 of the bootstrap phase)
3. ankylos prompt you for project metadata and will insert your custom build scripts along with this metadata into a fully-filled out and templated package.json file. finally, ankylos will walk through each of your plugins and apply/copy the files specifies in ankylos.config.js
4. from there, pnpm install
will bump you in to your new, modular, automatically-bootstrapped, linted, formatted, <insert a bunch more buzzwords> project!
i only had enough time to create a next
and node
preset so be sure to check those out. anyway, i'm glad i was able to follow through with this and i hope y'all like it! p.s: you can check out all 16, yes, 16 projects from the ankylos
monorepo on its dedicated npm org: www.npmjs.com/org/ankylos. anyway, i'll try my best to maintain this (it's in my best interest too so thats good) if anyone else decides to use it@rishiosaur/async
is built in Typescript, and has some awesome documentation as a result (Typedoc really comin thru), and has two hooks that I use a lot in my daily React life: usePromiseEffect
and useAsyncEffect
, both of which are modelled to look like idiomatic React (I’ve attached an example of their usage down below).
:githubparrot: You can find the Github repo over at z.rishi.cx/g/async (feel free to star!),
:npm: The NPM package over at www.npmjs.com/package/@rishiosaur/async,
🏗️ And the documentation over at async.rishi.cx!npx gwas-add-songs