moduscreateorg / budgeting Goto Github PK

Automatically format files using Prettier in a pre-commit hook. Guide: https://prettier.io/docs/en/precommit.html

Going with option 1, this would require adding 2 new dev dependencies: lint-staged and husky.

Description

Use redux sagas instead of thunk

Steps to reproduce

N/A

Observed Behavior

not using sagas

Expected Behavior

use sagas to make async actions more predictable and easier to test

Additional Details

https://decembersoft.com/posts/redux-thunk-vs-redux-saga/

It's common to see loaders like this in Webpack 1:

loaders: [
    'isomorphic-style'
    'css?sourceMap'
    'postcss?sourceMap'
    'sass?sourceMap'
]

This example isn't represented in this Webpack's config file.
Is that out of the scope of this sample project or is it something you're considering adding?

Steps to reproduce

• Visit https://budget.modus.app/budget or any other route directly

Observed Behavior

• This results in a 404 Page not found error.

Expected Behavior

• Content corresponding to the given route is displayed.

Screenshots

Potential solution:

• Now that the app has switched from HashRouter to BrowserRouter the server could be configured to redirect 404s to /, essentially letting the client handle them.

Update dependencies to use https://github.com/ModusCreateOrg/modus-react

Hello,

The Lint Task does not seem to work, when I run "yarn run lint" I get the following error:

/Users/markpaul/Documents/Source/Research/testagain/node_modules/eslint-config-airbnb-base/rules/style.js:
	Configuration for rule "no-restricted-syntax" is invalid:
	Value "[object Object]" must be an enum value.

Referenced from: /Users/markpaul/Documents/Source/Research/testagain/node_modules/eslint-config-airbnb-base/index.js
Referenced from: eslint-config-airbnb
Referenced from: /Users/markpaul/Documents/Source/Research/testagain/.eslintrc
Error: /Users/markpaul/Documents/Source/Research/testagain/node_modules/eslint-config-airbnb-base/rules/style.js:
	Configuration for rule "no-restricted-syntax" is invalid:
	Value "[object Object]" must be an enum value.

Referenced from: /Users/markpaul/Documents/Source/Research/testagain/node_modules/eslint-config-airbnb-base/index.js
Referenced from: eslint-config-airbnb
Referenced from: /Users/markpaul/Documents/Source/Research/testagain/.eslintrc
    at validateRuleOptions (/Users/markpaul/Documents/Source/Research/testagain/node_modules/eslint/lib/config/config-validator.js:109:15)
    at Object.keys.forEach.id (/Users/markpaul/Documents/Source/Research/testagain/node_modules/eslint/lib/config/config-validator.js:156:13)
    at Array.forEach (native)
    at Object.validate (/Users/markpaul/Documents/Source/Research/testagain/node_modules/eslint/lib/config/config-validator.js:155:35)
    at load (/Users/markpaul/Documents/Source/Research/testagain/node_modules/eslint/lib/config/config-file.js:529:19)
    at configExtends.reduceRight.e (/Users/markpaul/Documents/Source/Research/testagain/node_modules/eslint/lib/config/config-file.js:391:36)
    at Array.reduceRight (native)
    at applyExtends (/Users/markpaul/Documents/Source/Research/testagain/node_modules/eslint/lib/config/config-file.js:362:28)
    at load (/Users/markpaul/Documents/Source/Research/testagain/node_modules/eslint/lib/config/config-file.js:536:22)
    at configExtends.reduceRight.e (/Users/markpaul/Documents/Source/Research/testagain/node_modules/eslint/lib/config/config-file.js:391:36)
✨  Done in 1.46s.

It's not working. I have uploaded build with _redirects at http://fd.arcgate.in/budget and when we hard reload or refresh this page then show below error.

Not Found
The requested URL /budget was not found on this server.
Apache/2.2.15 (CentOS) Server at fd.arcgate.in Port 80

Thanks.

After cloning the project and installing the dependencies, when I run "npm start" I get:

Cannot find module './dll/d3-manifest.json'

is this a problem on my end or the project?
Thank you in advance!

It appears that this code has some of the issues discussed on this thread:

webpack/webpack#2537

Specifically, I had to remove the -p option or the Uglify plugin ran twice. Also, -p was not setting the NODE_ENV variable, so the production parts of the webpack.config were never being run. If I manually set the NODE_ENV at the command line to 'production', it would run the production sections of the webpack.config.

Clearing the NODE_ENV (set NODE_ENV=) and running webpack (no -p) result in a 1 meg package. Even if I manually set NODE_ENV, I get a 56k (gzip/min package), which is different than your size, so I am wondering what's wrong.

After npm i , npm start:

npm ERR! Linux 3.16.0-4-amd64
npm ERR! argv "/usr/bin/nodejs" "/usr/bin/npm" "start"
npm ERR! node v6.8.1
npm ERR! npm  v3.10.8
npm ERR! code ELIFECYCLE
npm ERR! webpack2-react-redux-budget-app-sample@1.0.0 start: `webpack-dev-server --history-api-fallback --progress --port 3000`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the webpack2-react-redux-budget-app-sample@1.0.0 start script 'webpack-dev-server --history-api-fallback --progress --port 3000'.
npm ERR! Make sure you have the latest version of node.js and npm installed.
npm ERR! If you do, this is most likely a problem with the webpack2-react-redux-budget-app-sample package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     webpack-dev-server --history-api-fallback --progress --port 3000
npm ERR! You can get information on how to open an issue for this project with:
npm ERR!     npm bugs webpack2-react-redux-budget-app-sample
npm ERR! Or if that isn't available, you can get their info via:
npm ERR!     npm owner ls webpack2-react-redux-budget-app-sample
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:
npm ERR!     /home/lex93ushakov/lab/budgeting-sample-app-webpack2/npm-debug.log

Flow seems to have all kind of issues (e.g. memory bloat). Even Facebook migrates from Flow to TypeScript.

Here's a good blog post that describes the transition: https://davidgom.es/porting-30k-lines-of-code-from-flow-to-typescript/

Source map for sass not work http://take.ms/QgOVF
But i change config for development version - http://take.ms/TOmSZ . But if i add source map for css-loader i see my source

Great work so far! When profiling the app on an EM connection (pretty real world 3G with accountability for spottiness) we don't see first meaningful paint until about 9 seconds in:

https://www.webpagetest.org/video/compare.php?tests=170501_97_ba8c5bf5efc877719f267f8011498293-r:2-c:0

If we dig into the waterfall we can see that quite a few of your critical path requests are taking a while to get fetched, pushing out the point when all of the JS gets fetched, parsed and executed.

Looking at the source you're using prefetch instead of preload here:

This will actually force your scripts to be loaded with a lower priority than if you use preload. I would strongly reco trying to use preload for these here.

Your total amount of JS in the app is relatively small. Still way under 100KB from what I can see.

This project is currently running on CircleCI 1.0 which will no longer be supported after August 31, 2018.

Migration guide to CircleCI 2.0: https://circleci.com/sunset1-0/

Including React Router 4 would be great, thanks

It would be awesome to see some simple tests for this environment.

Let's make this a PWA

Description

1. How can I set max-size for all the chunk files.
2. How can I reduce or split main.js file.

Steps to reproduce

1. npm run build > after build my chunk files and main.js will get bigger(more then 300kb).

Expected Behavior

1. I don't want to my chunk file size more then 250kb
2. I don't want to my entry point file(main.js) size more then 250kb

Additional Details

Please see attached file.

Current maintainability score is B. Code climate shows how to improve that score here: https://codeclimate.com/github/ModusCreateOrg/budgeting

Let's get that A!

Please add .idea files to .gitignore.

Description

It's not working for Internet Explorer(Edge, 10, 9)

Steps to reproduce

Please open below url in IE browser.

1. https://budgeting-a937b.firebaseapp.com/budget
2. then browser showing "Sorry, something went wrong. We're working on it and we'll get it fixed as soon as we can."

Please see attached screenshot.

Thanks,
BSR

I do not see the vender.js file in your online webside,how did u do this; because of webpack 2 (the tree shaking)?

Description

add storybooks https://storybook.js.org/

Steps to reproduce

N/A

Observed Behavior

N/A

Expected Behavior

use storybooks for component development and documentation

How does one know the tree shaking is done properly. In the webpack-visualizer, it seems like all of the npm packages were imported in full.

I can't run npm install, beause of peerDependencies:

npm ERR! Linux 3.13.0-83-generic
npm ERR! argv "/usr/bin/node" "/usr/bin/npm" "i"
npm ERR! node v0.12.12
npm ERR! npm  v2.14.9
npm ERR! code EPEERINVALID

npm ERR! peerinvalid The package [email protected] does not satisfy its siblings' peerDependencies requirements!
npm ERR! peerinvalid Peer [email protected] wants webpack@1 || ^2.1.0-beta
npm ERR! peerinvalid Peer [email protected] wants webpack@>=2.0.3-beta <3

npm ERR! Please include the following file with any support request:
npm ERR!     /home/.../budgeting-sample-app-webpack2/npm-debug.lo

On the current master branch, I end up with this error when I run npm run build.

ERROR in main-ee2fb0ea.js from UglifyJs
DefaultsError: `screw_ie8` is not a supported option

I'm running “npm run build”, so 1.7M!!!!
what happend?

Would it be beneficial if we just add all dependencies from package.json as vendor files in
webpack.config.js

Description

Error when trying to do npm start

Error:
Cannot find module './dll/libs-manifest.json'

Steps to reproduce

1. git clone this repo, cd into budgeting folder
2. ran npm install and then npm start

Observed Behavior

Expected Behavior

I expect webpack dev server to start.

Additional Details

Convert Babel to v7

Description

Hi Team,

I'm waiting for your updated "Budgeting App" with Webpack v4, ES8 or ES7, React v16, and Redux v4.

Thanks,
BSR

Description

1. I am getting Uncaught ReferenceError: libs_dll is not defined on browser console sometimes when I do command + shift + r.
2. The error is not consistent.
3. Also compile time has been increased drastically after this commit. 25e0d40 (This is the commit I am using).

Steps to reproduce

1. git clone https://github.com/ModusCreateOrg/budgeting-sample-app-webpack2.git
2. yarn install
3. yarn start
4. Open chrome and console panel
5. Access localhost:3000
6. command + shift + r multiple times after each reload
7. You will see the error.

Expected Behaviour

1. App should run all the time even on hard refresh
2. Sub sequent compile time should be less.

Additional Details

1. node : v6.11.1
2. yarn version : 1.0.0
3. npm : 3.10.10
4. Chrome : Version 60.0.3112.113 (Official Build) (64-bit)

Does it make sense to pre-load resources with higher priority than main module?
It should affect on time to interactive.. isn't it?

And the second question is - It seems like 'reports.js' is downloaded twice:

Can you help me to figure it out, please?

PS I'm using chrome with cache enabled; yarn run prod

Description

Ability to create multiple accounts for transactions

Description

currently the React Hot Loader version 3.0.0-beta.7, please migrate it to v4

Seems like three-shaking doesn't work. I see it with webpack-bundle-analyzer. React-route, react-router-dom and history libs are in full codebase.

I noticed that .map files are present even when you build source for production. Is it be design or a mistake? I always thought that you do not want to have maps on your production but just uglified/minified code for speed.

Description

I've wanted to use this project to bootstrap another React app, so I've just spent some short time removing the business logic, branding and config related to budgeting app.
Maybe it would be useful to keep a branch or a tag with a clean boilerplate in this repo?

These are the changes I've made to my fork: link.

If you think this might be a good idea, I can do another sweep and write better docs on this.

webpack --watch

With your config, webpack using 80% CPU