Installations
npm install cra-template-typescript-redux
Developer Guide
Typescript
No
Module System
CommonJS
Min. Node Version
>=16.0.0 <20.0.0
Node Version
18.16.0
NPM Version
9.5.1
Releases
Contributors
Unable to fetch Contributors
Languages
TypeScript (67.89%)
HTML (15.74%)
JavaScript (12.62%)
CSS (3.75%)
Developer
Download Statistics
Total Downloads
18,899
Last Day
10
Last Week
32
Last Month
99
Last Year
2,224
GitHub Statistics
93 Stars
595 Commits
22 Forks
2 Watching
21 Branches
3 Contributors
Package Meta Information
Latest Version
1.0.2
Package Id
cra-template-typescript-redux@1.0.2
Unpacked Size
50.08 kB
Size
29.70 kB
File Count
36
NPM Version
9.5.1
Node Version
18.16.0
Publised On
17 May 2023
Total Downloads
Cumulative downloads
Total Downloads
18,899
Last day
0%
10
Compared to previous day
Last week
60%
32
Compared to previous week
Last month
-59.1%
99
Compared to previous month
Last year
-44.4%
2,224
Compared to previous year
Daily Downloads
Weekly Downloads
Monthly Downloads
Yearly Downloads
Dependencies
27
A quick start Redux + TypeScript Create React App template
An opinionated quick start Create React App (CRA) template with configured Redux, TypeScript, React Router, React Testing Library and custom ESlint configuration.
Original Create React App README available here
Usage
1npx create-react-app your-project-name --template typescript-redux
Or
1yarn create react-app your-project-name --template typescript-redux
npx
command installs the most recent stable version of CRA from npm.
--template
parameter points to this template, note that cra-template-
prefix is omitted.
Motivation
You know the pain. You start a new project from scratch and need to configure it again and again. It needs routing, ok you setup Router, then you need Redux - ok, oh 😩 Redux boilerplate is taking so much time to type. Wait... what if you could have all the tools you want just from the beginning? I want to focus on building amazing projects and not spending hours configuring. That's why I've created this template. It's here for you to use.
Available Scripts
In the project directory, you can run:
-
yarn start
- runs the app in the development mode. Open http://localhost:3000 to view it in the browser. -
yarn test
- launches the test runner in the interactive watch mode. -
yarn build
- builds the app for production to thebuild
folder. -
yarn eject
- exposes content ofreact-script
package -
yarn lint
- lints project files according to eslint rules, see below. Typical use case: continuous integration environments, Travis, CircleCI, etc. -
yarn fix
- same asyarn lint
, but also fixes errors, when possible. Typical use case: local development environment, git hooks.
Due to CRA template limitations (we can change only scripts
and dependencies
inside generated package.json
) all configuration is done by adding config files where possible. Also no devDependencies
for now, sorry.
Redux configuration
The template provides basic Redux configuration with feature based folder structure. You can use Redux devtools browser extension. Sample feature included in src/features
folder, note technology agnostic features
folder name. Based on Redux maintainers recommendation.
Testing
Testing is done with React Testing Library.
Prettier
I added prettier
to force consistent formatting. Don't like trailing semicolons? Feel free to tweak prettier rules inside .prettierrc
file to match your code style.
Styles/CSS/Styling
Just for the styling purpose of the example app, I used Materialize. The template is shipped with the Materialize by default. I want to make sure that this template is style agnostic so you can plugin any CSS-in-JS or whatever library/framework you want to use for styles on your own.
How to remove materialize
In order to remove Materialize MaterializeCSS navigate to the public
folder, open index.html
and remove following CDN link in the <head>
lines 18-22:
1<!--Import materialize.css--> 2<link 3 rel="stylesheet" 4 href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css" 5/>
Remove or adjust all the classNames
related to the Materialize and feel free to use your own styling.
Eslint configurations
The template extends CRA ESLint rules with a custom set, tailored for the reasonable and clean development process.
Eslint rules are commented for your convenience feel free to tweak or remove them inside .eslintrc
. No judgment.
Testing template locally
To test the output of your template locally run
1npx create-react-app my-app --template file:./cra-template-typescript-redux
How to create custom Create React App (CRA) templates
I created a step by step guide on how to create your own templates.
Thank you
I hope this template will be helpful for you and you will love using it 🖤
No vulnerabilities found.
Reason
no dangerous workflow patterns detected
Reason
no binaries found in the repo
Reason
license file detected
Details
- Info: project has a license file: LICENSE:0
- Info: FSF or OSI recognized license: MIT License: LICENSE:0
Reason
SAST tool detected but not run on all commits
Details
- Info: SAST configuration detected: CodeQL
- Warn: 20 commits out of 30 are checked with a SAST tool
Reason
dependency not pinned by hash detected -- score normalized to 1
Details
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/codeql-analysis.yml:33: update your workflow using https://app.stepsecurity.io/secureworkflow/alexandr-g/cra-template-typescript-redux/codeql-analysis.yml/master?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/codeql-analysis.yml:41: update your workflow using https://app.stepsecurity.io/secureworkflow/alexandr-g/cra-template-typescript-redux/codeql-analysis.yml/master?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/codeql-analysis.yml:52: update your workflow using https://app.stepsecurity.io/secureworkflow/alexandr-g/cra-template-typescript-redux/codeql-analysis.yml/master?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/codeql-analysis.yml:66: update your workflow using https://app.stepsecurity.io/secureworkflow/alexandr-g/cra-template-typescript-redux/codeql-analysis.yml/master?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/e2e-tests.yml:11: update your workflow using https://app.stepsecurity.io/secureworkflow/alexandr-g/cra-template-typescript-redux/e2e-tests.yml/master?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/e2e-tests.yml:31: update your workflow using https://app.stepsecurity.io/secureworkflow/alexandr-g/cra-template-typescript-redux/e2e-tests.yml/master?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/main.yml:70: update your workflow using https://app.stepsecurity.io/secureworkflow/alexandr-g/cra-template-typescript-redux/main.yml/master?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/main.yml:71: update your workflow using https://app.stepsecurity.io/secureworkflow/alexandr-g/cra-template-typescript-redux/main.yml/master?enable=pin
- Warn: third-party GitHubAction not pinned by hash: .github/workflows/main.yml:78: update your workflow using https://app.stepsecurity.io/secureworkflow/alexandr-g/cra-template-typescript-redux/main.yml/master?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/main.yml:14: update your workflow using https://app.stepsecurity.io/secureworkflow/alexandr-g/cra-template-typescript-redux/main.yml/master?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/main.yml:16: update your workflow using https://app.stepsecurity.io/secureworkflow/alexandr-g/cra-template-typescript-redux/main.yml/master?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/main.yml:19: update your workflow using https://app.stepsecurity.io/secureworkflow/alexandr-g/cra-template-typescript-redux/main.yml/master?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/main.yml:34: update your workflow using https://app.stepsecurity.io/secureworkflow/alexandr-g/cra-template-typescript-redux/main.yml/master?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/main.yml:35: update your workflow using https://app.stepsecurity.io/secureworkflow/alexandr-g/cra-template-typescript-redux/main.yml/master?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/main.yml:50: update your workflow using https://app.stepsecurity.io/secureworkflow/alexandr-g/cra-template-typescript-redux/main.yml/master?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/main.yml:51: update your workflow using https://app.stepsecurity.io/secureworkflow/alexandr-g/cra-template-typescript-redux/main.yml/master?enable=pin
- Warn: third-party GitHubAction not pinned by hash: .github/workflows/main.yml:58: update your workflow using https://app.stepsecurity.io/secureworkflow/alexandr-g/cra-template-typescript-redux/main.yml/master?enable=pin
- Warn: containerImage not pinned by hash: .github/actions/set-pr-status/Dockerfile:1: pin your Docker image by updating node:slim to node:slim@sha256:66a57ce3fb719590aed5a22776e4de507ab4c0f445e89a761fc6847573103df3
- Info: 0 out of 15 GitHub-owned GitHubAction dependencies pinned
- Info: 0 out of 2 third-party GitHubAction dependencies pinned
- Info: 0 out of 1 containerImage dependencies pinned
- Info: 1 out of 1 npmCommand dependencies pinned
Reason
0 commit(s) and 0 issue activity found in the last 90 days -- score normalized to 0
Reason
detected GitHub workflow tokens with excessive permissions
Details
- Warn: no topLevel permission defined: .github/workflows/codeql-analysis.yml:1
- Warn: no topLevel permission defined: .github/workflows/e2e-tests.yml:1
- Warn: no topLevel permission defined: .github/workflows/main.yml:1
- Info: no jobLevel write permissions found
Reason
no effort to earn an OpenSSF best practices badge detected
Reason
security policy file not detected
Details
- Warn: no security policy file detected
- Warn: no security file to analyze
- Warn: no security file to analyze
- Warn: no security file to analyze
Reason
project is not fuzzed
Details
- Warn: no fuzzer integrations found
Reason
branch protection not enabled on development/release branches
Details
- Warn: branch protection not enabled for branch 'master'
Reason
49 existing vulnerabilities detected
Details
- Warn: Project is vulnerable to: GHSA-3xgq-45jj-v275
- Warn: Project is vulnerable to: GHSA-prr3-c3m5-p7q2
- Warn: Project is vulnerable to: GHSA-p8p7-x288-28g6
- Warn: Project is vulnerable to: GHSA-93q8-gq69-wqmw
- Warn: Project is vulnerable to: GHSA-qwcr-r2fm-qrc7
- Warn: Project is vulnerable to: GHSA-grv7-fg5c-xmjg
- Warn: Project is vulnerable to: GHSA-pxg6-pf52-xh8x
- Warn: Project is vulnerable to: GHSA-ff7x-qrg7-qggm
- Warn: Project is vulnerable to: GHSA-qw6h-vgh9-j6wx
- Warn: Project is vulnerable to: GHSA-c7qv-q95q-8v27
- Warn: Project is vulnerable to: GHSA-2p57-rm9w-gvfp
- Warn: Project is vulnerable to: GHSA-896r-f27r-55mw
- Warn: Project is vulnerable to: GHSA-9c47-m6qq-7p4h
- Warn: Project is vulnerable to: GHSA-76p3-8jx3-jpfq
- Warn: Project is vulnerable to: GHSA-3rfm-jhwj-7488
- Warn: Project is vulnerable to: GHSA-hhq3-ff78-jv3g
- Warn: Project is vulnerable to: GHSA-p6mc-m468-83gw
- Warn: Project is vulnerable to: GHSA-29mw-wpgm-hmr9
- Warn: Project is vulnerable to: GHSA-35jh-r3h4-6jhm
- Warn: Project is vulnerable to: GHSA-5v2h-r2cx-5xgj
- Warn: Project is vulnerable to: GHSA-rrrm-qjm4-v8hf
- Warn: Project is vulnerable to: GHSA-7wpw-2hjm-89gp
- Warn: Project is vulnerable to: GHSA-952p-6rrq-rcjv
- Warn: Project is vulnerable to: GHSA-f8q6-p94x-37v3
- Warn: Project is vulnerable to: GHSA-vh95-rmgr-6w4m
- Warn: Project is vulnerable to: GHSA-xvch-5gv4-984h
- Warn: Project is vulnerable to: GHSA-mwcw-c2x4-8c55
- Warn: Project is vulnerable to: GHSA-5rrq-pxf6-6jx5
- Warn: Project is vulnerable to: GHSA-8fr3-hfg3-gpgp
- Warn: Project is vulnerable to: GHSA-gf8q-jrpm-jvxq
- Warn: Project is vulnerable to: GHSA-2r2c-g63r-vccr
- Warn: Project is vulnerable to: GHSA-cfm4-qjh2-4765
- Warn: Project is vulnerable to: GHSA-x4jg-mjrx-434g
- Warn: Project is vulnerable to: GHSA-hj9c-8jmm-8c52
- Warn: Project is vulnerable to: GHSA-rp65-9cf3-cjxr
- Warn: Project is vulnerable to: GHSA-9wv6-86v2-598j
- Warn: Project is vulnerable to: GHSA-rhx6-c78j-4q9w
- Warn: Project is vulnerable to: GHSA-7fh5-64p2-3v2j
- Warn: Project is vulnerable to: GHSA-x2pg-mjhr-2m5x
- Warn: Project is vulnerable to: GHSA-c2qf-rxjj-qqgw
- Warn: Project is vulnerable to: GHSA-m6fv-jmcg-4jfg
- Warn: Project is vulnerable to: GHSA-cm22-4g7w-348p
- Warn: Project is vulnerable to: GHSA-4rq4-32rv-6wp6
- Warn: Project is vulnerable to: GHSA-64g7-mvw6-v9qj
- Warn: Project is vulnerable to: GHSA-vx3p-948g-6vhq
- Warn: Project is vulnerable to: GHSA-72xf-g2v4-qvf3
- Warn: Project is vulnerable to: GHSA-7p7h-4mm5-852v
- Warn: Project is vulnerable to: GHSA-4vvj-4cpr-p986
- Warn: Project is vulnerable to: GHSA-p9pc-299p-vxgp
Score
3.4
/10
Last Scanned on 2025-01-13
The Open Source Security Foundation is a cross-industry collaboration to improve the security of open source software (OSS). The Scorecard provides security health metrics for open source projects.
Learn MoreOther packages similar to cra-template-typescript-redux
cra-template-redux-typescript
The official Redux+TS template for Create React App
cra-template-sdw
The base SDW template for Create React App.
cra-template-structure
CRA template, Directory structure for big React application.
cra-template-overwolf-typescript-redux
This is the official [Overwolf TypeScript Redux](https://github.com/AlbericoD/overwolf-modern-react-boilerplate) template for [Create React App](https://github.com/facebook/create-react-app).