Skip to content

Commit 3457792

Browse files
kpachhaikpachhai
authored
Initial commit
0 parents  commit 3457792

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

65 files changed

+6180
-0
lines changed

Diff for: ‎.eslintrc

+29
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
{
2+
"env": {
3+
"browser": true,
4+
"es6": true,
5+
"node": true
6+
},
7+
"extends": [
8+
"eslint:recommended",
9+
"plugin:react/recommended",
10+
"plugin:@typescript-eslint/recommended",
11+
"plugin:prettier/recommended"
12+
],
13+
"parser": "@typescript-eslint/parser",
14+
"parserOptions": {
15+
"ecmaFeatures": {
16+
"jsx": true
17+
},
18+
"ecmaVersion": "latest",
19+
"sourceType": "module"
20+
},
21+
"plugins": ["react", "@typescript-eslint"],
22+
"rules": {
23+
"react/react-in-jsx-scope": "off"
24+
},
25+
"globals": {
26+
"chrome": "readonly"
27+
},
28+
"ignorePatterns": ["watch.js", "dist/**"]
29+
}

Diff for: ‎.github/dependabot.yml

+11
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
# To get started with Dependabot version updates, you'll need to specify which
2+
# package ecosystems to update and where the package manifests are located.
3+
# Please see the documentation for all configuration options:
4+
# https://docs.github.com/github/administering-a-repository/configuration-options-for-dependency-updates
5+
6+
version: 2
7+
updates:
8+
- package-ecosystem: "npm" # See documentation for possible values
9+
directory: "/" # Location of package manifests
10+
schedule:
11+
interval: "weekly"

Diff for: ‎.github/workflows/build.yml

+23
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
name: Build And Test
2+
3+
on:
4+
push:
5+
branches: [ main ]
6+
pull_request:
7+
branches: [ main ]
8+
9+
jobs:
10+
build:
11+
12+
runs-on: ubuntu-latest
13+
14+
steps:
15+
- uses: actions/checkout@v3
16+
- name: Setup Node.js
17+
uses: actions/setup-node@v3
18+
with:
19+
cache: 'yarn'
20+
- run: yarn install
21+
- run: yarn build:hmr
22+
- run: yarn test
23+
- run: yarn build

Diff for: ‎.github/workflows/greetings.yml

+16
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
name: Greetings
2+
3+
on: [pull_request_target, issues]
4+
5+
jobs:
6+
greeting:
7+
runs-on: ubuntu-latest
8+
permissions:
9+
issues: write
10+
pull-requests: write
11+
steps:
12+
- uses: actions/first-interaction@v1
13+
with:
14+
repo-token: ${{ secrets.GITHUB_TOKEN }}
15+
issue-message: 'Thank you for your contribution. We will check and reply to you as soon as possible.'
16+
pr-message: 'Thank you for your contribution. We will check and reply to you as soon as possible.'

Diff for: ‎.gitignore

+18
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
# dependencies
2+
/node_modules
3+
4+
# testing
5+
/coverage
6+
7+
# build
8+
/dist
9+
10+
# etc
11+
.DS_Store
12+
.env.local
13+
.idea
14+
15+
# compiled
16+
utils/reload/*.js
17+
utils/reload/injections/*.js
18+
public/manifest.json

Diff for: ‎.nvmrc

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
18.12.0

Diff for: ‎.prettierrc

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
{
2+
"singleQuote": false,
3+
"trailingComma": "es5",
4+
"arrowParens": "always"
5+
}

Diff for: ‎LICENSE

+21
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
The MIT License (MIT)
2+
3+
Copyright (c) 2022 Seo Jong Hak
4+
5+
Permission is hereby granted, free of charge, to any person obtaining a copy
6+
of this software and associated documentation files (the "Software"), to deal
7+
in the Software without restriction, including without limitation the rights
8+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9+
copies of the Software, and to permit persons to whom the Software is
10+
furnished to do so, subject to the following conditions:
11+
12+
The above copyright notice and this permission notice shall be included in all
13+
copies or substantial portions of the Software.
14+
15+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21+
SOFTWARE.

Diff for: ‎README.md

+88
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,88 @@
1+
<div align="center">
2+
<img src="public/icon-128.png" alt="logo"/>
3+
<h1> Chrome Extension Boilerplate with<br/>React + Vite + TypeScript</h1>
4+
5+
![](https://img.shields.io/badge/React-61DAFB?style=flat-square&logo=react&logoColor=black)
6+
![](https://img.shields.io/badge/Typescript-3178C6?style=flat-square&logo=typescript&logoColor=white)
7+
![](https://badges.aleen42.com/src/vitejs.svg)
8+
![GitHub action badge](https://github.com/Jonghakseo/chrome-extension-boilerplate-react-vite/actions/workflows/build.yml/badge.svg)
9+
<img src="https://hits.seeyoufarm.com/api/count/incr/badge.svg?url=https://github.com/Jonghakseo/chrome-extension-boilerplate-react-viteFactions&count_bg=%23#222222&title_bg=%23#454545&title=😀&edge_flat=true" alt="hits"/>
10+
11+
12+
> This project is listed in the [Awesome Vite](https://github.com/vitejs/awesome-vite)
13+
14+
</div>
15+
16+
## Table of Contents
17+
18+
- [Intro](#intro)
19+
- [Features](#features)
20+
- [Installation](#installation)
21+
- [Procedures](#procedures)
22+
- [Screenshots](#screenshots)
23+
- [NewTab](#newtab)
24+
- [Popup](#popup)
25+
- [Documents](#documents)
26+
27+
28+
## Intro <a name="intro"></a>
29+
This boilerplate is made for creating chrome extensions using React and Typescript.
30+
> The focus was on improving the build speed and development experience with Vite.
31+
32+
## Features <a name="features"></a>
33+
- [React 18](https://reactjs.org/)
34+
- [TypeScript](https://www.typescriptlang.org/)
35+
- [Jest](https://jestjs.io/)
36+
- [React Testing Library](https://testing-library.com/docs/react-testing-library/intro/)
37+
- [Vite](https://vitejs.dev/)
38+
- [SASS](https://sass-lang.com/)
39+
- [ESLint](https://eslint.org/)
40+
- [Prettier](https://prettier.io/)
41+
- [Chrome Extension Manifest Version 3](https://developer.chrome.com/docs/extensions/mv3/intro/)
42+
- HRR(Hot Rebuild & Refresh/Reload)
43+
44+
## Installation <a name="installation"></a>
45+
46+
### Procedures <a name="procedures"></a>
47+
1. Clone this repository.
48+
2. Change `name` and `description` in package.json => **Auto synchronize with manifest**
49+
3. Run `yarn install` or `npm i` (check your node version >= 16.6, recommended >= 18)
50+
4. Run `yarn dev` or `npm run dev`
51+
5. Load Extension on Chrome
52+
1. Open - Chrome browser
53+
2. Access - chrome://extensions
54+
3. Check - Developer mode
55+
4. Find - Load unpacked extension
56+
5. Select - `dist` folder in this project (after dev or build)
57+
6. If you want to build in production, Just run `yarn build` or `npm run build`.
58+
59+
## Screenshots <a name="screenshots"></a>
60+
61+
### New Tab <a name="newtab"></a>
62+
63+
<img width="971" src="https://user-images.githubusercontent.com/53500778/162631646-cd40976b-b737-43d0-8e6a-6ac090a2e2d4.png">
64+
65+
### Popup <a name="popup"></a>
66+
67+
<img width="314" alt="popup" src="https://user-images.githubusercontent.com/53500778/203561728-23517d46-12e3-4139-8a4f-e0b2f22a6ab3.png">
68+
69+
70+
## Documents <a name="documents"></a>
71+
- [Vite Plugin](https://vitejs.dev/guide/api-plugin.html)
72+
- [ChromeExtension](https://developer.chrome.com/docs/extensions/mv3/)
73+
- [Rollup](https://rollupjs.org/guide/en/)
74+
- [Rollup-plugin-chrome-extension](https://www.extend-chrome.dev/rollup-plugin)
75+
76+
77+
78+
---
79+
## Thanks To
80+
81+
| [Jetbrains](https://jb.gg/OpenSourceSupport) | [Jackson Hong](https://www.linkedin.com/in/j-acks0n/) |
82+
|--------------------------------------------------------------------------------------------------------------------------------------------|--------------------------------------------------------------------------------------------------|
83+
| <img width="100" src="https://resources.jetbrains.com/storage/products/company/brand/logos/jb_beam.png" alt="JetBrains Logo (Main) logo."> | <img width="100" src='https://avatars.githubusercontent.com/u/23139754?v=4' alt='Jackson Hong'/> |
84+
85+
86+
---
87+
88+
[Jonghakseo](https://nookpi.tistory.com/)

0 commit comments

Comments
 (0)