Skip to main content
Log in
6

6ewis

@6ewis·27 public vizzes

Loading thumbnail…

bad words

This visualization presents a force-directed network of profanity-related terms, where each word is a node connected to others based on shared letters or textual relationships. The graph uses `d3.forceSimulation` to position nodes and `d3.forceLink` to draw edges, with node size and color mapping to word frequency or category. The underlying data comes from a text list of explicit terms, parsed into a graph structure in JavaScript. Labels appear on hover, and the layout stabilizes after several ticks, revealing clusters of related slang and sexual terminology.

Dec 1, 2020
Loading thumbnail…

module app

This example shows the Gradle build configuration for an Android application, highlighting the setup of project-level and module-level build scripts. It demonstrates how the code configures Android plugin versions, Kotlin support, and Google Services integration through conditional logic based on preferences. The build.gradle files use the Gradle build system with the Android Gradle plugin, Kotlin Gradle plugin, and dependency management via repositories like Google and JCenter. The configuration includes version checks for Kotlin and Google Services plugins, along with SDK version settings.

Aug 7, 2020
Loading thumbnail…

Gist 134c3254e89206cd8c069069456c9720

This example shows an Android application build configuration that relies on the Apache Cordova framework and the Gradle build system. It demonstrates how the build.gradle file dynamically applies plugins and dependencies based on settings from cdvHelpers, such as enabling Kotlin or Google Services support. The code uses the com.android.tools.build:gradle API and conditional classpath declarations to manage plugin versions and build reproducibility.

Aug 7, 2020
Loading thumbnail…

docker compose sample

This example shows a multi-service Docker Compose setup for local development, defining a main application service along with MySQL and Adminer containers. The main service builds from a local context with a development target, mounts the current directory as a volume while preserving the container’s node_modules, exposes port 9229 for debugging, runs `npm run start:dev`, and loads environment variables from a `.env` file. The MySQL service uses the `mysql:latest` image with a native password authentication plugin, sets a root password, and persists data in a named volume. Adminer provides a web-based database client on port 8080, with all services connected via a custom `webnet` network.

May 28, 2020
Loading thumbnail…

Config to Run nest and mysql

This example shows a Docker Compose configuration that sets up a NestJS application with a MySQL database and an Adminer interface for database management. The `main` service builds a development container with mounted source code and hot-reloading via `npm run start:dev`, while the `mysql` service uses the official MySQL image with a root password and persistent storage through a named volume. Adminer runs on port 8080 and connects to the MySQL container. The configuration uses Docker Compose’s networking and volume APIs to link services and preserve data across container restarts.

May 22, 2020
Loading thumbnail…

React native check internet speed

This example shows a React Native function that measures internet speed by timing a parallel fetch of a JSON API request and a file download from a fixed test URL. Using `RNFetchBlob` for the file download and native `fetch` for the API call, it calculates kilobytes per second from the elapsed time and classifies the connection as very bad, average, good, or excellent based on thresholds like 150, 550, and 2000 kB/s. The code then triggers warning messages for each category and cleans up the cached file with `RNFetchBlob.fs.unlink`.

Jul 16, 2019
Loading thumbnail…

s3 lambda permission

This visualization shows the AWS Identity and Access Management (IAM) permissions required for an S3 bucket used by a Lambda function. It displays the policy structure, including the `s3:*` action and the bucket ARN as the resource, using a hierarchical tree layout. The code employs D3.js (likely `d3.hierarchy` and `d3.tree`) to render the JSON policy as connected nodes, with the root representing the policy object and branches for the action, effect, and resource arrays. The data comes directly from the gist’s static JSON configuration.

Nov 21, 2018
Loading thumbnail…

using reduce for updating nested object vs destructuring

This example contrasts two JavaScript techniques for updating a nested object in response to user interaction, using a simple bar chart built with D3.js. It shows a `reduce` method that iteratively rebuilds the object and a destructuring approach that spreads the previous state, both updating a count property. The data is a small hardcoded array of items, and clicking a button triggers the update, with the resulting chart rendered as SVG rectangles. The visualization highlights the syntactic and structural differences between the two state-management patterns.

Jan 13, 2018
Loading thumbnail…

The correct way to compile ES6 using babel...

This example shows how to configure Babel and Webpack to compile ES6 code into three separate module formats for different consumption contexts. It demonstrates three distinct build targets—Node.js unbundled, Node.js bundled, and browser bundled—each with its own Babel preset and package.json entry point. The code specifies `babel-preset-env` with environment-specific targets like `node: "6.10"` or `browsers: "last 2 versions, ie 10-11"`, and uses the `modules: false` option to enable tree shaking. The accompanying `package.json` and `webpack.config.js` files illustrate how to wire these build scripts together, with Webpack automatically selecting the appropriate entry point (`main`, `module`, or `browser`) based on the `target` setting.

Nov 2, 2017
Loading thumbnail…

Describe the life-cycle method

This example visualizes the React component life-cycle methods as a hierarchical flow diagram, showing the sequence from constructor through mounting and update phases to unmounting. The rendering uses a custom React component tree that mimics the structure of composite component instances, with nested children representing the call order of lifecycle events. The diagram maps each method—such as `componentWillMount`, `shouldComponentUpdate`, and `componentDidUpdate`—into a step-by-step path, using indentation and arrows to indicate parent-child execution. The source is a gist by 6ewis, presented as an annotated code comment, and the visualization is built with React’s component model rather than a charting library.

Oct 13, 2017
Loading thumbnail…

Ramda Title Case

This example demonstrates how to build a text-transformation pipeline using the Ramda functional library, converting a plain string into title case. The visualization shows the step-by-step composition of small, reusable functions, starting with splitting the input on spaces. The code defines a `capitalize` function using `R.converge` to concatenate an uppercased first character with the remaining tail, and then composes a `toTitleCase` function with `R.compose`, `R.join`, and `R.map`. The entire transformation is expressed through pure function composition rather than imperative loops.

Aug 11, 2017
Loading thumbnail…

Gist 810577150f4b252e8faa69e7060bf3af

This example presents a Clojure visualization of a custom sorting algorithm called `sorting-sort`. The code defines two functions: `remove-one`, which removes a specified item from a list using `split-with` and `rest`, and `sorting-sort`, which iteratively finds the minimum value in an unsorted collection via `apply min`, removes it, and appends it to a sorted vector within a `loop`/`recur` construct. The visualization likely animates this selection-sort-like process, though no graphical library is shown; the gist contains only the algorithmic logic without any rendering or charting API.

Jun 21, 2016
Loading thumbnail…

Gist a51f9f38b3cbd9d5116fbeff931b7d14

This example demonstrates a client-lookup autocomplete filter, matching typed input against billing records by client name or number. It uses Ramda’s `R.filter`, `R.reduce`, and `R.curry` to build a reusable predicate that compares a trimmed, lowercased query against the first characters of each field. The code includes a concise Ramda-based solution, a plain JavaScript variant using `Array.filter` and `String.slice`, and a commented alternative with `R.either`. The data is a hardcoded array of client objects with address fields, sourced from a gist.

Apr 29, 2016
Loading thumbnail…

(contains-key :a {:v 1 :b 3 :a 3 :g 6})

This visualization demonstrates three recursive implementations of a `contains-key` function in Clojure, which checks whether a given key exists within a hashmap. The code defines the function variably using a loop with destructuring, sequential key comparison via `keys`, and a dissociative approach with `dissoc` and `nil` checks. It shows how different structural recursion patterns—through `recur` and `loop`—can solve the same lookup problem, relying on Clojure’s core sequence and map APIs, including `seq`, `first`, `rest`, and `empty?`.

Apr 7, 2016
Loading thumbnail…

Gist 4bf048f7f79c05c84eab4ce6e023d20f

This example demonstrates a React accordion interface with three collapsible panels, the third containing a nested React component that renders an editable text input field. The code uses the `react-bootstrap` Accordion and Panel components to structure the collapsible groups, while a custom `Test` component manages its own state via `getInitialState` and `handleChange` to update the input value in real time. The outer `Test` component’s render method creates an inner React class instance, though its parent panel primarily displays static placeholder text. The rendering is handled through `ReactDOM.render` on a specified mount node, with the input’s state initialized to the string "test".

Apr 1, 2016
Loading thumbnail…

Gist 4974858be3b0a24bbeed1a8fbbade3be

This example shows a collapsible accordion interface built with React, featuring three panels where the first two contain static placeholder text and the third embeds a user-editable input field. It demonstrates nested interactive components within a Bootstrap-style Accordion using the React framework. The code uses React.createElement and a custom class with getInitialState and handleChange methods to manage the input’s state, updating its value as the user types. The accordion and panel components come from a React library, and the example relies on ReactDOM.render to display the instance.

Apr 1, 2016
Loading thumbnail…

Gist aac0eca8d414b9a0e631cf8aad0af710

This example demonstrates an interactive React accordion interface where each collapsible panel contains static placeholder text, except for a custom panel that renders a controlled text input. The code uses React’s `createClass` and `setState` to manage the input field’s state, while the accordion relies on React-Bootstrap’s `Accordion` and `Panel` components. It shows how to compose custom child components inside panels while maintaining independent state for nested elements like form inputs. The accordion’s collapsible behavior is driven by React-Bootstrap’s internal event handling, with no external data source or rendering library involved.

Apr 1, 2016
Loading thumbnail…

Teach ramda

This example contrasts two refactorings of the same state-update logic in JavaScript, both using the Ramda library to remove an attribute from a matching object in an array. The first script composes functions like `findIndex`, `propEq`, and `adjust` to locate an object by ID and apply `dissocPath` to delete a nested field. The second script uses `R.when` with `R.propEq` and `R.dissoc` to achieve the same result, then verifies equality with `R.equals`. The code shows how Ramda’s declarative helpers replace manual `map` and `slice` iterations for immutable updates.

Mar 18, 2016
Loading thumbnail…

Mocking a few Monsters with Minitest::Mock

This example demonstrates how Minitest::Mock verifies that Ruby methods receive only expected arguments. The first mock monster expects an `eat` method called with a `Symbol` and a `Numeric`, and it raises `MockExpectationError` when given a `String` or a mismatched symbol. A second Cookie Monster mock expects a `:cookie` argument, rejecting `:village`. The gist shows both failed and successful interactions, concluding with `verify` returning `true` after each monster consumes its correct input. The code directly uses `Minitest::Mock`'s `expect`, `eat`, and `verify` APIs to assert strict argument matching.

Jun 26, 2015
Loading thumbnail…

Gist acd4e515970a40a52b46

This example visualizes the configuration and plugin mappings from a user’s `.zshrc` and `.vimrc` files, revealing how shell and editor settings are organized. It presents the raw text content of these dotfiles, highlighting sections like PATH exports, theme selection, and Vim key remappings. The rendering uses plain text display with syntax highlighting, likely via a JavaScript library such as highlight.js, to delineate commented lines, variables, and Vim commands. The layout follows the file structure, making the hierarchy of settings and aliases directly readable.

Nov 17, 2014
Loading thumbnail…

Gist d6cbe45544b6e9628a66

This visualization is a text-based configuration file, not a graphical chart. It shows a tmux terminal multiplexer setup, written in the tmux.conf scripting language, detailing key bindings, pane navigation, and plugin management. The code configures tmux through commands like `bind-key`, `set-option`, and `set-window-option`, and integrates the tmux plugin manager (tpm) via `run-shell` to load plugins such as tmux-resurrect for session persistence. It also adjusts mouse support, history limits, and copy-mode behavior, reflecting a developer’s personalized environment rather than data-driven graphics. The rendering approach is purely textual, with no external visualization libraries involved.

Nov 17, 2014
Loading thumbnail…

Installing vim 7.4 with lua on Ubuntu 12.04

This example shows a terminal command sequence for compiling and installing Vim 7.4 with Lua and Luajit support on Ubuntu 12.04. It documents the full process, from removing existing Vim packages and installing dependencies to cloning the Vim source via Mercurial, configuring with flags like `--enable-luainterp` and `--with-luajit`, and running `make` and `sudo make install`. The visualization captures the step-by-step shell commands, highlighting the package names, configuration options, and file paths in a sequential layout.

May 29, 2014
Loading thumbnail…

fast parser

The example processes a pipe-delimited CSV file containing customer meter readings, using Ruby’s CSV library to parse each row. It calculates statistics on unique customers, electricity versus gas usage, and monthly average consumptions. The code also groups customers by their number of meter readings and prints these distributions in formatted text tables. Active Support’s inflector and Date::MONTHNAMES are used for label handling, while a Set tracks unique customer IDs. The output is a plain-text summary of computed statistics, with no graphical visualization.

Jan 25, 2014
Loading thumbnail…

Gist 8522961

This visualization demonstrates the distribution of utility customers by the number of meter readings they have, broken down by energy type. It shows how many customers fall into each category of meter-reading frequency, allowing comparison between electricity and gas customers. The Ruby code parses a pipe-delimited CSV file using the `CSV` library, structures the data with a `Customer` struct, and computes statistics through a `Statistics` module. The chart is rendered as text-based output, using string formatting and the `Date::MONTHNAMES` constant to display monthly averages, with results centered using the `center` method for alignment.

Jan 20, 2014
Loading thumbnail…

here is what I suggest you could do

This example demonstrates how Ruby overrides object equality to ensure that distinct instances with the same `id` are treated as identical, using ActiveSupport’s `present?` and the `alias :eql? :==` pattern. It shows the result of `Array#uniq_by` (from Active Support) collapsing three `Article` objects into one, even though they are separate instances. The code relies on `attr_accessor :id`, the `==` method, and the `eql?` alias to define value-based comparison. The output is a single `Article` object, illustrating the effect of custom equality in collections. The implementation uses Ruby’s core classes and Active Support extensions.

Dec 13, 2013
Loading thumbnail…

random test. # I wanted to try and flush the string before it dies. note that ruby only has a finalizer , it does not have a destructor. I could have use ObjectSpace.define_finalizer self, proc {persist} and use GC.start at the command line to run the garbage collector however it would be after destroying an instance object.

This example demonstrates a Ruby class called `PersistentString` that extends the built-in `String` class, showing how to add persistence and utility methods while retaining core string behavior. The code shows what the class does—such as saving data to files, checking palindromes, and reading/appending file contents—before explaining how it works, using instance methods like `persist` and class methods like `read_to` and `append_to`, with error handling via `STDERR.puts`. It relies on standard Ruby APIs like `File.open`, `File.exist?`, and `STDOUT.puts`, and the example uses interactive console sessions (e.g., `2.0.0-p247 :004 >`) to illustrate usage. The data source is user-provided strings, and the rendering approach is file-based output, not visual.

Dec 11, 2013
Loading thumbnail…

random task =)

This example visualizes the output of a Ruby `Task` class’s `reccurent` method, which generates an array of recurring month-day strings from a starting date. The code implements date arithmetic via the `>>` operator, using `strftime` for formatting, and demonstrates edge-case handling when the target day does not exist in a month (e.g., February 28). The visualization, driven by RSpec test expectations, highlights the method’s behavior for valid recurrence counts (1–12) and its argument validation. The data appears as a static set of expected date lists derived from the spec file’s assertions, showing the recurring dates for five and eight month intervals.

Dec 11, 2013