{"id":17497545,"url":"https://github.com/miguelcastillo/brackets-harmony","last_synced_at":"2025-04-03T00:27:10.979Z","repository":{"id":30621227,"uuid":"34176628","full_name":"MiguelCastillo/Brackets-Harmony","owner":"MiguelCastillo","description":"Brackets extension base project with ES Harmony","archived":false,"fork":false,"pushed_at":"2015-05-16T13:28:17.000Z","size":462,"stargazers_count":3,"open_issues_count":1,"forks_count":1,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-02-08T14:44:53.111Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","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/MiguelCastillo.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2015-04-18T18:03:24.000Z","updated_at":"2015-07-06T02:12:08.000Z","dependencies_parsed_at":"2022-09-05T01:01:20.985Z","dependency_job_id":null,"html_url":"https://github.com/MiguelCastillo/Brackets-Harmony","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/MiguelCastillo%2FBrackets-Harmony","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/MiguelCastillo%2FBrackets-Harmony/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/MiguelCastillo%2FBrackets-Harmony/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/MiguelCastillo%2FBrackets-Harmony/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/MiguelCastillo","download_url":"https://codeload.github.com/MiguelCastillo/Brackets-Harmony/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":246914951,"owners_count":20854305,"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":[],"created_at":"2024-10-19T15:57:01.623Z","updated_at":"2025-04-03T00:27:10.960Z","avatar_url":"https://github.com/MiguelCastillo.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"## Brackets-Harmony\nBrackets extension base (boilerplate) project built for ES Harmony.  The idea is that you can have a starting point for your Brackets extension that you are looking to write in ES2015 and later.\n\nBrackets-Harmony has several [gulp](http://gulpjs.com/) tasks that leverage tools such as [babeljs](https://babeljs.io/) and [browserify](http://browserify.org/) to transpile your code written in ES Harmony to good ole ES5, so that your code can happily run in Brackets.\n\n\n#### React JSX\n[babeljs](https://babeljs.io/) natively supports transpiling [react's jsx](https://facebook.github.io/react/docs/jsx-in-depth.html), so you can easily write your components using [react](http://facebook.github.io/react/) using jsx syntax.\n\n\n#### Gulp tasks\n\nThe build system uses [gulp](http://gulpjs.com/), and below are the available tasks.\n\n\u003e Tasks should be tweaked to accommodate your particular needs.\n\n\n##### package\nCompiles all source files, and creates a zip file in the `dist` folder that can be consumed by Brackets.  The generated zip file contains the `package.json` for the project.\n\n```\ngulp package\n```\n##### build\nCompiles all source files, and copies them to the `dist` folder.\n\n```\ngulp build\n```\n\n##### watch\nWatches all source files for changes, and recompiles anything that has changed accordingly.\n\n```\ngulp watch\n```\n\n##### serve\nWatches files for changes and spins up a server serving the static content in the `dist` folder.  With small tweaks, you can use this to run your unit tests in the browser with tools like [mocha](http://mochajs.org/)\n\n```\ngulp serve\n```\n\n\n#### Getting started\nIn order to get started, you need install all npm dependencies.\n\n```\nnpm install\n```\n\nThen you normally just run `build`, `package`, or `watch`.\n\n```\ngulp build\n```\n\n#### Screenshot\n\u003cimg src=\"https://raw.githubusercontent.com/MiguelCastillo/Brackets-Harmony/master/img/screenshot.png\" width=\"320px\"/\u003e\n\n\n### Practices - conventions - opinions.\n\nFirst of all, I strongly encourage folks to write JavaScript using the newer features from ES2015 (formerly named ES6). The new features and syntax makes crafting code in JavaScript a much more joyful experience.  At the very least, you should try it.  Oh, if you want to follow up on a conversation about the ES6 =\u003e ES2015 conversion, check [this](https://esdiscuss.org/topic/javascript-2015) out.\n\nUse and abuse [learnharmony](http://learnharmony.org/) and [babeljs](https://babeljs.io/docs/learn-es6/).  They are great resources and they were created to help you.  If you have feedback, please go to their corresponding github repos and submit issues.\n\n**So, ok. You want to try ES2015 in your new Brackets extension...  Where do you go?**\n\nClone this project, and start writing your Brackets extension code in [`src/main.js`](https://github.com/MiguelCastillo/Brackets-Harmony/blob/master/src/main.js).  That's your main entry point.  All your code goes in the [`src`](https://github.com/MiguelCastillo/Brackets-Harmony/blob/master/src) directory.  The build system in this project can package things up for you so that you can easily load your new extension into Brackets.\n\n1. Run `gulp package`\n2. Install the generated zip artifact via Brackets extension manager.\n3. Restart Brackets and Ka-Baaam! Your extension is loaded.\n\nOr you can do as I do...  I create a symlink from `dist` into the Brackets' extension's folder.  That way my code changes take effect without needing to reinstall the zip file.\n\n```\nln -sf ~/Projects/Brackets-Harmony/dist ~/Library/Application\\ Support/Brackets/extensions/user/harmony\n```\n\n\u003e I am on a Linux based OS, so symlinks work great...  I am not sure what the equivalent is on Windows.\n\nThere are two helper modules to help you easily integrate with Brackets ecosystem.  `appReady` and `_module`.\n\n- `appReady` is basically a wrapper around `AppInit.appReady` that waits for the module `_module` to be fully loaded.\n- `_module` gives you access to the requirejs main module for your plugin so that you can call functions like `ExtensionUtils.loadStyleSheet` that require a requirejs module to find the asset you need to load.\n\n\n**ReactJS...** I personally have found React to be a really useful tool for writing UI components, so I have included a sample JSX view in this project to help you with your curiosity. But... Feel free to ditch ReactJS and use your favorite stuff.\n\nAnd finally, this project is created for you!  So *copy it, clone it, use it, abuse it, sell it...*  You cannot really steal it because I have already given it to you.  It's MIT license.  What you don't want to do is just tweak this project and then publish it as your own...  Not because you cannot do it, but because it confuses other developers when deciding what project to use - and that's rude!  Please consider making a PR first - I am very happy to take PRs!\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmiguelcastillo%2Fbrackets-harmony","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmiguelcastillo%2Fbrackets-harmony","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmiguelcastillo%2Fbrackets-harmony/lists"}