{"id":21680124,"url":"https://github.com/matthisk/es6console","last_synced_at":"2025-04-12T06:23:03.229Z","repository":{"id":31906050,"uuid":"35475121","full_name":"matthisk/es6console","owner":"matthisk","description":"🔮 Play with ECMAScript compilers","archived":false,"fork":false,"pushed_at":"2018-01-15T10:51:11.000Z","size":2159,"stargazers_count":152,"open_issues_count":13,"forks_count":25,"subscribers_count":4,"default_branch":"master","last_synced_at":"2025-03-26T01:41:33.345Z","etag":null,"topics":["compilers","ecmascript","es6","javascript"],"latest_commit_sha":null,"homepage":"https://es6console.com","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/matthisk.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2015-05-12T08:03:46.000Z","updated_at":"2024-09-03T07:46:58.000Z","dependencies_parsed_at":"2022-08-25T05:21:13.423Z","dependency_job_id":null,"html_url":"https://github.com/matthisk/es6console","commit_stats":null,"previous_names":[],"tags_count":1,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/matthisk%2Fes6console","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/matthisk%2Fes6console/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/matthisk%2Fes6console/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/matthisk%2Fes6console/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/matthisk","download_url":"https://codeload.github.com/matthisk/es6console/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248526029,"owners_count":21118794,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["compilers","ecmascript","es6","javascript"],"created_at":"2024-11-25T15:14:36.140Z","updated_at":"2025-04-12T06:23:03.191Z","avatar_url":"https://github.com/matthisk.png","language":"JavaScript","readme":"# ES6Console.com\n\nThis is the main repository of es6console.com. A tool for playing around with ECMAScript 6 to 5 transformers.\n\n## Table of Contents\n1. [Features](#features)\n1. [Requirements](#requirements)\n1. [Application Structure](#application-structure)\n1. [Development](#development)\n  1. [Developer Tools](#developer-tools)\n  1. [Routing](#routing)\n1. [Testing](#testing)\n1. [Deployment](#deployment)\n1. [Build System](#build-system)\n  1. [Configuration](#configuration)\n  1. [Globals](#globals)\n  1. [Styles](#styles)\n  1. [Server](#server)\n  1. [Production Optimization](#production-optimization)\n\n## Features\n* [serverless](http://serverless.com)\n* [react](https://github.com/facebook/react)\n* [redux](https://github.com/rackt/redux)\n* [react-router](https://github.com/rackt/react-router)\n* [webpack](https://github.com/webpack/webpack)\n* [babel](https://github.com/babel/babel)\n* [eslint](http://eslint.org)\n\n## Requirements\n* node `^4.5.0`\n* yarn `^0.17.0` or npm `^3.0.0`\n\n### Install from source\n\nFirst, clone the project:\n\n```bash\n$ git clone https://github.com/matthisk/es6console.git \u003cmy-project-name\u003e\n$ cd \u003cmy-project-name\u003e\n```\n\nThen install dependencies and check to see it works. It is recommended that you use [Yarn](https://yarnpkg.com/) for deterministic installs, but `npm install` will work just as well.\n\n```bash\n$ npm install    # Install project dependencies\n$ npm run dev      # Compile and launch (same as `npm start`)\n```\n\nWhile developing, you will probably rely mostly on `npm dev`; however, there are additional scripts at your disposal:\n\n|`npm run \u003cscript\u003e`|Description|\n|------------------|-----------|\n|`start`|Serves your app at `localhost:8000`. HMR will be enabled in development.|\n|`compile`|Compiles the application to disk (`~/dist` by default).|\n|`dev`|Same as `npm start`, but enables nodemon for the server as well.|\n|`test`|Runs unit tests with Karma and generates a coverage report.|\n|`test:dev`|Runs Karma and watches for changes to re-run tests; does not generate coverage reports.|\n|`deploy`|Runs linter, tests, and then, on success, compiles your application to disk.|\n|`deploy:staging`|Same as `deploy` but overrides `NODE_ENV` to \"development\".|\n|`deploy:prod`|Same as `deploy` but overrides `NODE_ENV` to \"production\".|\n|`deploy_lambda`|Same as `deploy_lambda` but overrides `NODE_ENV` to \"production\".|\n|`deploy_lambda:staging`|Same as `deploy_lambda` but overrides `NODE_ENV` to \"production\".|\n|`deploy_lambda:prod`|Same as `deploy_lambda` but overrides `NODE_ENV` to \"production\".|\n|`lint`|Lint all `.js` files.|\n|`lint:fix`|Lint and fix all `.js` files. [Read more on this](http://eslint.org/docs/user-guide/command-line-interface.html#fix).|\n\n## Application Structure\n\n\n```\n.\n├── bin                      # Build/Start scripts\n├── config                   # Project and build configurations\n├── public                   # Static public assets (not imported anywhere in source code)\n├── server                   # Express application that provides webpack middleware\n│   └── main.js              # Development Server application entry point\n├── src                      # Application source code\n│   ├── index.html           # Main HTML page container for app\n│   ├── main.js              # Application bootstrap and rendering\n│   ├── components           # Global Reusable Presentational Components\n│   ├── containers           # Global Reusable Container Components\n│   ├── layouts              # Components that dictate major page structure\n│   │   └── CoreLayout.js    # CoreLayout which receives children for each route\n│   │   └── CoreLayout.scss  # Styles related to the CoreLayout\n│   │   └── index.js         # Main file for layout\n│   ├── routes               # Main route definitions and async split points\n│   │   ├── index.js         # Bootstrap main application routes with store\n│   │   ├── Home             # Fractal route\n│   │   │   ├── index.js     # Route definitions and async split points\n│   │   │   ├── assets       # Assets required to render components\n│   │   │   ├── components   # Presentational React Components\n│   │   │   └── routes **    # Fractal sub-routes (** optional)\n│   ├── store                # Redux-specific pieces\n│   │   ├── createStore.js   # Create and instrument redux store\n│   │   └── reducers.js      # Reducer registry and injection\n│   └── styles               # Application-wide styles (generally settings)\n├── lambda                   # AWS Lambdas\n└── tests                    # Unit tests\n```\n\n## Development\n\n#### Developer Tools\n\n## Testing\nTo add a unit test, simply create a `.spec.js` file anywhere in `~/tests`. Karma will pick up on these files automatically, and Mocha and Chai will be available within your test without the need to import them. Coverage reports will be compiled to `~/coverage` by default. If you wish to change what reporters are used and where reports are compiled, you can do so by modifying `coverage_reporters` in `~/config/project.config.js`.\n\n## Deployment\nES6Console is hosted on Amazon S3. When running `npm run deploy` the `~/dist` folder is synced up to the s3 bucket configured in `config/environment.config.js`. The website requires several backend scripts which are hosted on AWS Lambda using the serverless framework. When running `npm run deploy_lambda` these lambdas are automatically deployed.\n\n### Configuration\n\nDefault project configuration can be found in `~/config/project.config.js`. Here you'll be able to redefine your `src` and `dist` directories, adjust compilation settings, tweak your vendor dependencies, and more. For the most part, you should be able to make changes in here **without ever having to touch the actual webpack build configuration**.\n\nIf you need environment-specific overrides (useful for dynamically setting API endpoints, for example), you can edit `~/config/environments.config.js` and define overrides on a per-NODE_ENV basis. There are examples for both `development` and `production`, so use those as guidelines. Here are some common configuration options:\n\n|Key|Description|\n|---|-----------|\n|`dir_src`|application source code base path|\n|`dir_dist`|path to build compiled application to|\n|`server_host`|hostname for the Express server|\n|`server_port`|port for the Express server|\n|`compiler_devtool`|what type of source-maps to generate (set to `false`/`null` to disable)|\n|`compiler_vendor`|packages to separate into to the vendor bundle|\n\nWebpack is configured to make use of [resolve.root](http://webpack.github.io/docs/configuration.html#resolve-root), which lets you import local packages as if you were traversing from the root of your `~/src` directory. Here's an example:\n\n```js\n// current file: ~/src/views/some/nested/View.js\n// What used to be this:\nimport SomeComponent from '../../../components/SomeComponent'\n\n// Can now be this:\nimport SomeComponent from 'components/SomeComponent' // Hooray!\n```\n\n### Globals\n\nThese are global variables available to you anywhere in your source code. If you wish to modify them, they can be found as the `globals` key in `~/config/project.config.js`. When adding new globals, make sure you also add them to `~/.eslintrc`.\n\n|Variable|Description|\n|---|---|\n|`process.env.NODE_ENV`|the active `NODE_ENV` when the build started|\n|`__DEV__`|True when `process.env.NODE_ENV` is `development`|\n|`__PROD__`|True when `process.env.NODE_ENV` is `production`|\n|`__TEST__`|True when `process.env.NODE_ENV` is `test`|\n\n### Styles\n\nBoth `.scss` and `.css` file extensions are supported out of the box. After being imported, styles will be processed with [PostCSS](https://github.com/postcss/postcss) for minification and autoprefixing, and will be extracted to a `.css` file during production builds.\n\n### Production Optimization\n\nBabel is configured to use [babel-plugin-transform-runtime](https://www.npmjs.com/package/babel-plugin-transform-runtime) so transforms aren't inlined. In production, webpack will extract styles to a `.css` file, minify your JavaScript, and perform additional optimizations such as module deduplication.\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmatthisk%2Fes6console","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmatthisk%2Fes6console","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmatthisk%2Fes6console/lists"}