https://github.com/2ssue/electron-chat
'electron 애플리케이션 개발' 책의 chatting 앱 예제를 최신 버전으로 만들어보는 프로젝트
https://github.com/2ssue/electron-chat
chatting-app electron firebase react
Last synced: 3 months ago
JSON representation
'electron 애플리케이션 개발' 책의 chatting 앱 예제를 최신 버전으로 만들어보는 프로젝트
- Host: GitHub
- URL: https://github.com/2ssue/electron-chat
- Owner: 2ssue
- Created: 2019-11-02T14:58:33.000Z (over 6 years ago)
- Default Branch: master
- Last Pushed: 2023-05-07T04:30:02.000Z (about 3 years ago)
- Last Synced: 2026-04-11T06:42:03.433Z (3 months ago)
- Topics: chatting-app, electron, firebase, react
- Language: JavaScript
- Homepage:
- Size: 1.82 MB
- Stars: 1
- Watchers: 1
- Forks: 2
- Open Issues: 6
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Electron-Chat
This project converted this book's examples (electron-chat) to current version react and electron.
## Install
```bash
$yarn
```
## Usage
```bash
# Note
#
# You have to make .env file before start.
# This project don't inform server information. checkout `dev.env`
$cd electron-chat
# react build
$yarn run build
# run electron
$yarn run electron
```
## Packaging
```bash
$Copy ./src/electron ./build/electron -Recurse
$cd build
# At electron/createWindows.js file, modify file path statement like this.
# pathname: path.join(__dirname, '../index.html'),
#
# And create package.json file like below, and start packaging.
# If you don't want to show raw code, use `--asar` option when packaging.
$yarn run packager
```
### build/package.json
```json
{
"name": "electron-chat",
"version": "1.0.0",
"description": "",
"main": "electron/electron-starter.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"packager": "npx electron-packager . electron-chat --platform win32 --arch x64 --out release/"
},
"author": "",
"license": "ISC"
}
```
## Project Structure
This project's structure is based on [express generator](https://expressjs.com/ko/starter/generator.html)
```bash
electron-chat
├── 📁public
├── 📂src
│ ├── 📁electron # about electron source
│ ├── 📁router # react component source
│ ├── 📄 App.js
│ ├── 📄 index.css
│ ├── 📄 index.js # entry point
│ └── 📄 logo.svg
├── .env # config file related firebase api. check dev.env
├── package-lock.json
└── package.json
```
## Tech
| module name | description |
| ------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| [dotenv](https://www.npmjs.com/package/dotenv) | Dotenv is a zero-dependency module that loads environment variables from a .env file into process.env. Storing configuration in the environment separate from code is based on The Twelve-Factor App methodology. |
| [create-react-app](https://www.npmjs.com/package/create-react-app) | Create React apps with no build configuration. |
| [styled component](https://www.npmjs.com/package/styled-components) | Visual primitives for the component age. Use the best bits of ES6 and CSS to style your apps without stress 💅 |
| [electron](https://www.npmjs.com/package/electron) | The Electron framework lets you write cross-platform desktop applications using JavaScript, HTML and CSS. It is based on Node.js and Chromium and is used by the Atom editor and many other apps. |
| [firebase](https://www.npmjs.com/package/firebase) | Firebase provides the tools and infrastructure you need to develop, grow, and earn money from your app. This package supports web (browser), mobile-web, and server (Node.js) clients. |
## Author
Sujeong Lee
- Github: [@2ssue](https://github.com/2ssue)