If you have experience with animation in other media, CSS animation’s percentage-based keyframe syntax can feel pretty alien, especially if you want to be very precise about timing. This Sass function lets you forget about percentages and express keyframes in terms of actual frames:
@function f($frame) {
@return percentage( $frame / $totalframes )
}
| package main | |
| import ( | |
| "context" | |
| "flag" | |
| "fmt" | |
| "log" | |
| "net/http" | |
| "os" | |
| "os/signal" |
Migrations are a way to make database changes or updates, like creating or dropping tables, as well as updating a table with new columns with constraints via generated scripts. We can build these scripts via the command line using knex command line tool.
To learn more about migrations, check out this article on the different types of database migrations!
How do you send information between clients and servers? What format should that information be in? What happens when the server changes the format, but the client has not been updated yet? What happens when the server changes the format, but the database cannot be updated?
These are difficult questions. It is not just about picking a format, but rather picking a format that can evolve as your application evolves.
By now there are many approaches to communicating between client and server. These approaches tend to be known within specific companies and language communities, but the techniques do not cross borders. I will outline JSON, ProtoBuf, and GraphQL here so we can learn from them all.
A tiny (265 byte) utility to create state machine components using two pure functions.
The API is a single function that accepts 2 pure functions as arguments:
| /** | |
| Note: | |
| This is useing rollup the svelte pluing and buble plugin | |
| If you do not want to use this, just adjust the command being created in `getRollupCommand` to | |
| just make a commond to use the svelete-cli | |
| This is also asuming that all components are in a folder structure like this: | |
| - src | |
| - components | |
| - example_compent_name |
| .DS_Store | |
| node_modules | |
| dist |
| int doubler(int x) { | |
| return 2 * x; | |
| } |
| /** Async version of Array.prototype.reduce() | |
| * await reduce(['/foo', '/bar', '/baz'], async (acc, v) => { | |
| * acc[v] = await (await fetch(v)).json(); | |
| * return acc; | |
| * }, {}); | |
| */ | |
| export async function reduce(arr, fn, val, pure) { | |
| for (let i=0; i<arr.length; i++) { | |
| let v = await fn(val, arr[i], i, arr); | |
| if (pure!==false) val = v; |