Learn modern JavaScript from 7 expert authors – EdgeCoders

  • Learn modern JavaScript from 7 expert authors40 hours of video, 1000+ pages of guidance, 7 authors, the best ways to build modern JavaScript apps is hard.
  • Whether it’s web or native, it doesn’t matter.
  • What’s Redux again?Where do you even begin?If you’re like most, you start at a random spot that piques your interest.
  • Then you read a bunch of random blogs and Stack Overflow answers and Readme files on GitHub and voilĂĄ, 10 years later, you’re a pro.😅That’s why this holiday season I got together with 6 other expert JavaScript authors and designed a coherent learning journey.
  • Self-paced learning from 7 expert authors who will answer your email if you have a question.You start with the basics of modern JavaScript, continue with React and Redux, learn all about the modern build tools, follow it up with native apps, build some shiny examples that would make your mom…

Learning the best ways to build modern JavaScript apps is hard. Whether it’s web or native, it doesn’t matter. There’s just so much you have to learn. ES6, ES6+, 2016/2017. Why do people say…
Continue reading “Learn modern JavaScript from 7 expert authors – EdgeCoders”

Learning React.js: Getting Started and Concepts ― Scotch

  • — React Code Goes Here — – – /script – /body – /html – In React, components mount to an element, so in this example we can use the div myDiv as it’s parent container.
  • These attributes are available in our component as this.props and can be used in our render method to render dynamic data: – var MyComponent = React.createClass({ – render: function(){ – return ( – h1Hello, {this.props.name}!
  • Below, see how we can set our component’s state: – var MyComponent = React.createClass({ – getInitialState: function(){ – return { – count: 5 – } – }, – render: function(){ – return ( – h1{this.state.count}/h1 – ) – } – }); – – Events – React also has a built…
  • Lets make our count increment below using events: – /** @jsx React.DOM */ – – var Counter = React.createClass({ – incrementCount: function(){ – this.setState({ – count: this.state.count + 1 – }); – }, – getInitialState: function(){ – return { – count: 0 – } – }, – render: function(){ -…
  • == -1; – }); – this.setState({items: updatedList}); – }, – getInitialState: function(){ – return { – initialItems: [ – “Apples”, – “Broccoli”, – “Chicken”, – “Duck”, – “Eggs”, – “Fish”, – “Granola”, – “Hash Browns” – ], – items: [] – } – }, – componentWillMount: function(){ – this.setState({items: this.state.initialItems})…

Today we are going to kick off the first installment in a new series of tutorials, Learning React, that will focus on becoming proficient and effective with Facebook’s React library. Before we start building anything meaningful, its important that we cover some base concepts first, so lets get this party started.
Continue reading “Learning React.js: Getting Started and Concepts ― Scotch”

Anyone interested in collaboration on Wireflow.co ? [Open Source Project]

  • People had bad ux cause app was not production ready, server was not prepared for that, and they mostly saw loading app -.
  • I was thinking, lets use Meteor.js for web app and real-time collaboration + Fabric.js for canvas manipulation (cause it have all we needed) + beautiful graphics which will be used for flows.
  • The app is huge mess I believe since few people messed with backend while they were learning Meteor.
  • Despite bad user experience cause of some bugs and never loading app, people actually love it.
  • Anything will help, from organizing project, reporting bugs, documentation, roadmap, upgrading app to latest meteor version, features … You know already, any help is welcome.

Hi people,

[image]

Recently one of our old, unfinished, buggy side projects got hunted on ProductHunt https://www.producthunt.com/posts/wireflow. It got quite good popularity. Most of …
Continue reading “Anyone interested in collaboration on Wireflow.co ? [Open Source Project]”

Black Friday sale is live! Every course on the site is $10! Lowest price ever! Limited time!

#ReactJS #ReactNative #GraphQL Newsletter Issue 65

  • This week we start learning everything about React, figure out CSS in React & JS, use React Patterns, get started with the best early Black Friday developer deals and much more!
  • Are you curious about React and haven’t had the chance to learn it?
  • An Opinionated Take on the Current State of Navigation in React Native – – The new release has a lot of new features to facilitate the designing of robust components and enhancements to speed up the rendering pipeline.
  • That’s it for the newest edition of the best ReactJS, React Native & GraphQL Newsletter!
  • Like & follow for all the news about ReactJS, React Native & GraphQL!

This week we start learning everything about React, figure out CSS in React & JS, use React Patterns, get started with the best early Black Friday developer deals and much more!
Continue reading “Black Friday sale is live! Every course on the site is $10! Lowest price ever! Limited time!”

Clean Code vs. Dirty Code: React Best Practices

Clean #Code vs. Dirty Code: #ReactJS Best Practices:  by @donavon #JavaScript

  • This article will focus on clean code practices as they apply to modern React software development.
  • Many React developers rely on Jest for a zero-configuration test runner and to produce code coverage reports.
  • And don’t discount the “rewrite factor” and time spent fixing comments from code reviews.
  • The advantage of letting React set your prop defaults, however, is that it produces more efficient code, defaults props in a based lifecycle component, as well as allows your default values to be checked against .
  • For example, the following component is ripe for converting to an SFC. – – The clean version clears a lot of the screen clutter of the dirty version.

Clean code is a consistent style of programming that makes your code easier to write, read, and maintain. Discover how to make your React code cleaner using easy-to-follow examples.
Continue reading “Clean Code vs. Dirty Code: React Best Practices”

4. Four ways to style react components – codeburst

  • All depend on your personal preferences and the specific complexity of your application.If you want to add just a few style properties, then inline styling is the best option.When you want to reuse your style properties in the same file then style-component are perfect.When your application is more complex I…
  • Instead they are specified with an object whose key is the camelCased version of the style name, and whose value is the style’s value, usually a string.We can create a variable that stores style properties and then pass it to the element like style={nameOfvariable}We can also pass the styling directly…
  • CSS ModulesA CSS Module is a CSS file in which all class names and animation names are scoped locally by default.
  • Great article about css modules here.Similar to css we import css file import styles ‘.
  • Styled-components 💅Styled-components is a library for React and React Native that allows you to use component-level styles in your application that are written with a mixture of JavaScript and CSSFirst we need to install styled-components librarynpm install styled-components –saveNow we can create a variable by selecting a particular html element…

There are four different options to style React components. All depend on your personal preferences and the specific complexity of your application. In React, inline styles are not specified as a…
Continue reading “4. Four ways to style react components – codeburst”

Why shouldn’t I use jQuery in React?

  • what you could do in theory is move the state outside of react in something like redux.
  • so JQuery does something -> statecontainer gets the update -> react will do something accordingly.
  • in theory react is just a view library, so you could use jquery to build your framework and render everything with react still react can only “see and hear” what’s happening in react.
  • it’s functional so it does not care about the global state unless you patch it in.
  • I would not use jQuery in react unless it’s really necessary, which it’s probably not.

Almost everyone is saying: »Don’t use jQuery in React!«
But they don’t really explain why. They just say don’t use it. I haven’t found any good reasons yet. No problem to use it! Example: VS Don’t use it! Why:.
Continue reading “Why shouldn’t I use jQuery in React?”