Add rfe/rfep/cmmb #1

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Merged

ice-chillios merged 8 commits into r5n-labs:master from YutHelloWorld:master

Aug 28, 2017

Merged

Add rfe/rfep/cmmb #1

ice-chillios merged 8 commits into r5n-labs:master from YutHelloWorld:master

Aug 28, 2017

Conversation

YutHelloWorld

Copy link

Contributor

@YutHelloWorld YutHelloWorld commented Aug 25, 2017 •

edited

Loading

Add 3 snippets for React Functional Component and Comments big block.
Inspired by Our Best Practices for Writing React Components.

rfe -> React functional export component
rfep -> React functional export component with propTypes
cmmb -> comment big block
modify code style: delete semi and add space before function parentheses inspired by JavaScript Standard Style
change mapDispatchToProps as object. See react-redux/mapDispatchToProps

[mapDispatchToProps(dispatch, [ownProps]): dispatchProps] (Object or Function): If an object is passed, each function inside it is assumed to be a Redux action creator. An object with the same function names, but with every action creator wrapped into a dispatch call so they may be invoked directly, will be merged into the component’s props.

Thank you for these great snippets!

Sven added 6 commits

August 26, 2017 03:43


 add rfe/rfep/cmmb

8f74a90


 add space before function parentheses

e49407d


 change mapDispatchToProps

d5c1054


 delet bindActionCreator

e2f8467


 update readme.md

abf7959


 update readme.md

7c424e5

ice-chillios

ice-chillios requested changes

Aug 26, 2017

View reviewed changes

Copy link

Member

@ice-chillios ice-chillios left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Just a few thoughts :) I'm glad that someone is using those snippets :) I hope there will be more of contributions in future :) 🚀

snippets/snippets.json Outdated

"prefix": "rfe",

"body": [

"import React from 'react'",

"function ${1:componentName} () {",

Copy link

Member

@ice-chillios ice-chillios Aug 26, 2017

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Please add spaces after imports, also to keep consistency you can just write const ComponentName = () =>. I would like to keep this as arrow function. :)

Copy link

Contributor Author

@YutHelloWorld YutHelloWorld Aug 26, 2017

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

const ExpandableForm = ({ onExpand, expanded, children }) => {

Looks very modern, but the function here is actually unnamed.
This lack of name will not be a problem if your Babel is set up correctly — but if it’s not, any errors will show up as occurring in <> which is terrible for debugging.

README.md Outdated

@@ -57,26 +62,29 @@ Every space inside `{ }` and `( )` means that this is pushed into next line :)

|`cwup→`|`componentWillUpdate = (nextProps, nextState) => { }`|

|`cdup→`|`componentDidUpdate = (prevProps, prevState) => { }`|

|`cwun→`|`componentWillUnmount = () => { }`|

|`ren→`|`render() { return( ) }`|

Copy link

Member

@ice-chillios ice-chillios Aug 26, 2017

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm not quite a fan of adding space after render, It's just a called function which is getting weird with something like. this.functionName () than this.functionName()

Copy link

Contributor Author

@YutHelloWorld YutHelloWorld Aug 26, 2017

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I‘m wrong. :). It should be as this:

render() {
 ...something
}
function MyComponent() {
 ...something
}

It should not put a space between function name and ( .


 fix space between function and (

041e48a

@YutHelloWorld

Copy link

Contributor Author

YutHelloWorld commented Aug 26, 2017 •

edited

Loading

@dsznajder I fixed some thing just now

ice-chillios

ice-chillios requested changes

Aug 27, 2017

View reviewed changes

README.md Outdated

export class 1ドル extends Component {

render() {

Copy link

Member

@ice-chillios ice-chillios Aug 27, 2017

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

✂️ Space :D

snippets/snippets.json Outdated

@@ -535,25 +573,25 @@

"componentRender": {

"prefix": "ren",

"body": [

"render() {",

Copy link

Member

@ice-chillios ice-chillios Aug 27, 2017

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Space ✂️

snippets/snippets.json Outdated

"",

"export default class ${1:componentName} extends Component {",

" render() {",

Copy link

Member

@ice-chillios ice-chillios Aug 27, 2017

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Space ✂️

snippets/snippets.json Outdated

"",

"export class ${1:componentName} extends Component {",

" render() {",

Copy link

Member

@ice-chillios ice-chillios Aug 27, 2017

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Space ✂️

Copy link

Contributor Author

@YutHelloWorld YutHelloWorld Aug 27, 2017

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

fixed these 😂

snippets/snippets.json Outdated

"",

"}",

"",

"function ${1:componentName} () {",

Copy link

Member

@ice-chillios ice-chillios Aug 27, 2017

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Space after the name of a function is correct for you? :) Still, I'm not a fan of function :).


 space delete

@ice-chillios

Copy link

Member

ice-chillios commented Aug 28, 2017

Ok :) @YutHelloWorld Nice work :) Thanks for contribution

ice-chillios

ice-chillios approved these changes

Aug 28, 2017

View reviewed changes

@ice-chillios ice-chillios merged commit d08974f into r5n-labs:master

Aug 28, 2017

@YutHelloWorld

Copy link

Contributor Author

YutHelloWorld commented Aug 28, 2017

the stateless functional components is not in readme, maybe you need add them

Labels

None yet

2 participants

@YutHelloWorld @ice-chillios

Add rfe/rfep/cmmb #1

Add rfe/rfep/cmmb #1

Uh oh!

Conversation

@YutHelloWorld YutHelloWorld commented Aug 25, 2017 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

@ice-chillios ice-chillios left a comment

Choose a reason for hiding this comment

Uh oh!

@ice-chillios ice-chillios Aug 26, 2017

Choose a reason for hiding this comment

Uh oh!

@YutHelloWorld YutHelloWorld Aug 26, 2017

Choose a reason for hiding this comment

Uh oh!

@ice-chillios ice-chillios Aug 26, 2017

Choose a reason for hiding this comment

Uh oh!

@YutHelloWorld YutHelloWorld Aug 26, 2017

Choose a reason for hiding this comment

Uh oh!

YutHelloWorld commented Aug 26, 2017 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

@ice-chillios ice-chillios Aug 27, 2017

Choose a reason for hiding this comment

Uh oh!

@ice-chillios ice-chillios Aug 27, 2017

Choose a reason for hiding this comment

Uh oh!

@ice-chillios ice-chillios Aug 27, 2017

Choose a reason for hiding this comment

Uh oh!

@ice-chillios ice-chillios Aug 27, 2017

Choose a reason for hiding this comment

Uh oh!

@YutHelloWorld YutHelloWorld Aug 27, 2017

Choose a reason for hiding this comment

Uh oh!

@ice-chillios ice-chillios Aug 27, 2017

Choose a reason for hiding this comment

Uh oh!

ice-chillios commented Aug 28, 2017

Uh oh!

YutHelloWorld commented Aug 28, 2017

Uh oh!

Uh oh!

@YutHelloWorld YutHelloWorld commented Aug 25, 2017 •

edited

Loading

YutHelloWorld commented Aug 26, 2017 •

edited

Loading