Electric IRC leverages TypeScript, React, and Electron to create a native IRC client. Below, I'll write a few notes that relate to this project and to its technologies.
This project uses the yarn package manager. Yarn has several benefits over NPM, the most relevant of which is a lockfile and easy dependency deletions/additions.
Often times, external modules will not have TypeScript definitions in place. In order to use these modules, you might:
- Find an external module definition through DefinitelyTyped and add the typing as a dependency, or
- Create your own typing in the
@typesfolder in the root of this directory if necessary (this is incredibly not-fun and should probably be avoided).
React is a library for component-based UI design. It uses
.jsx extensions normally, but when using TypeScript these are
Electron builds cross-platform, native applications using a web back-end. Visual Studio Code, Atom, Discord, and Slack are all built using it, to name a few.
SCSS is a CSS extension that allows for some nifty things like variables. The styling is split up into multiple folders, which are all eventually imported into a single main SCSS file.
One SCSS file should be created per component, and each SCSS file should aim to use as few magic numbers/colors as possible, preferring to use and re-use variables across the entire application.
This project uses WebPack behind the scenes. If the configuration needs to be edited, it will be a rough time, because WebPack is dense and awful. The configuration can be edited if we need to, but...it should be avoided if at all possible.
To run this project in a development environment, use
yarn start. This will open up Electron and load the app through a test server.
To package this app,use
yarn dist. This compiles the application into a native executable, as well as generates an installer for the application.
This app uses Spectron along with Mocha, Chai, and Sinon (using Sinon-Chai). I haven't quite figured out the setup for Spectron yet - if you want to test electron integration (as opposed to React components/web logic) this will take some effort.
All test files should be placed within the
test folder and have the extension
Istanbul is used for code coverage. Running
package.json in the
Until we get Spectron figured out, I've removed all of our "main" files from Istanbul's code coverage metrics, as we can't effectively unit-test them.