ArrayMapper
Array mapper is a tool for developers, who wants to have clear image of an array that they're working with.
You can install ArrayMapper by npm: npm install arraymapper
List of upcoming features in version 0.0.3:
- Remove values from an array - Updated: 30/09/2017
List of upcoming features in version 0.0.4:
The version 0.0.4 will be available 21st of October
- Add UI JSON objects explorer
- Modify JSON objects
- Add possibility to work with one dimensional array
- Change the look of an application from UI perspective
- I will fix existing bugs
1. Description:
An ArrayMapper is a small tool for Front End Developers, that provides possibility to take a look at your array without using console.log()
As you can see below, it has graphic interface where you can see:
- Index and value of selected element. If you hover on one of the elements, you can see index and value as well.
- Check how many elements is between two selected elements.
- See approximate memory usage of your array
- See length of your array.
- You can select index from an array and see what is inside by just typing index number in the panel section.
- Find specific value in an array by just typing value in the panel section, that you want to find.
- You can simulate, how your array is going to look like by pushing values into it and seeing live changes.
- In the structure section, you can see whole structure of your array
- You can also see, what types your array is full of. Simply saying, it shows you how many strings, numbers or booleans you've got in your array.
- You can simulate removing values from an array
Do you like it? It's just small amount of function that ArrayMapper is having. More functions is coming to it really soon.
2. Documentation
Step 1: Add your array into the app
Open app.js and to the function
generate.setArray([]) append your array. It should look like on below screenshot:
Step 2: Webpack
ArrayMapper has included Webpack as a dev-dependency but if for some reason you don't have it, install newest webpack.
npm install webpack
Once you've got webpack installed, you can open command line and type: webpack app.js app.bundle.js
After that, just go to the app folder, run index.html and it's working. No localhost.
3. Contribution
If you want to contribute, go ahead. Fork the repo and contribute.
If you have new ideas, how to improve ArrayMapper or found a bug. Post everyting in the "Issues" tab.