Code Monkey home page Code Monkey logo

magicxer's Introduction

magicxer

npm npm npm

Magical words mixer. Combines words from list into a list of clever mixes. You can check it out live at magicxer.magicznyleszek.xyz.

It also has some code for splitting words to syllables -- simple but imperfect solution for a surprisingly complex problem.

Usage

npm install magicxer --save
const magicxer = require("magicxer").magicxer;
return magicxer.mix("snow", "white");
// ["snowte", "snite", "sne", "snowhite", "shite", "ste"]
import { magicxer } from "magicxer";
magicxer.mix("snow", "white");

Technicalities

This is a small webapp project that I created to check out some fancy new tech:

  • Parcel
  • Vue.js
  • Jest
  • TypeScript
  • Prettier
  • 2 spaces indentation :-D
  • .editorconfig

Development

You probably want to watch tests: npm run test-watch.

Website

Change code at src and run Parceljs live server (localhost:2038): npm start.

Module

Change code at lib or src, run npm run build-module and use your local version in your other npm project.

Building

Development website outcome is in dev, production website is in docs1 and module code is in dist.

Before commiting the changes, make sure to run npm run build-website or npm run build-module - depending on what part of the project you've worked on.

Footnotes

  1. We use docs directory, because Github Pages allows to serve only root or docs.

magicxer's People

Contributors

magicznyleszek avatar

Watchers

 avatar  avatar

magicxer's Issues

Highlight which part of mix is from what word

We would need to keep more complex data, but it will be pretty :-P We will need to generate random colors for multiple words or just have left and right side highlighted and only on hover?

Improve mixing

smutny plus leszek should give smutneszek and smuteszek

Create useful layout

There are no styles now, let's add some:

  • there should probably be three columns:
    | beginnings |    outcome    | endings |
    
    changing to two columns on small screens?
    | beginnings | endings |
    |        outcome       |
    
  • switch from inputs with spaces to textarea with new lines

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.