New Lessons #10
Comments
|
Would something about unit testing be worth adding? |
|
Sure, if you can get Jest running in the browser :) |
|
Why can't you use just Jasmine? I was under the impression it works fine in the browser on its own. |
|
I didn't look too much into testing or Jest, but I had the impression it was a one-stop-shop. I just read that you can use Jest assertions and mocks with Jasmine, so this is an option. Now I just need to find some resources on what makes a good React unit test :D I mean I can write a bunch, but chances are that they don't add much value. |
|
Give yourself some credit mate. Just seeing how to import/mock/stub stuff will be a huge help. It'll really take this repo "to the next level" in my eyes. One stop shop. :) |
<!DOCTYPE html>
<script src="https://unpkg.com/[email protected]/umd/react.development.js"></script>
<script src="https://unpkg.com/@babel/standalone/babel.min.js"></script>
<script src="https://unpkg.com/[email protected]/umd/react-test-renderer-shallow.development.js"></script>
<script src="https://unpkg.com/expect@%3C21/umd/expect.min.js"></script>
<script src="https://unpkg.com/[email protected]/mocha.js"></script>
<link href="https://unpkg.com/[email protected]/mocha.css" rel="stylesheet" />
<script type="text/babel">
mocha.setup("bdd");
const MyComponent = () => (
<div>
<span className="heading">Title</span>
</div>
);
describe("Component", () => {
it("Should render", () => {
const renderer = new ReactShallowRenderer();
renderer.render(<MyComponent />);
const result = renderer.getRenderOutput();
expect(result.type).toBe("div");
expect(result.props.children).toEqual(<span className="heading">Title</span>);
})
});
mocha.checkLeaks();
mocha.run();
</script>
<div id="mocha"></div>Got a first draft done with Mocha. |
|
Hey @kay-is , why are you not using ES6 code, since it has become defacto for learning react .Even facebook recommends that . i know ES6 syntax will add learning complexity for beginners. just curious to know . |
|
@mdsaleemj I thought about this, but I'm not sure it would much value. I mostly talk about how React concepts relate to basic JavaScript constructs, which are already part of ES5 (objects, functions etc). But yeah, I guess this is something to consider in a year or two, when basically all JS devs know about >ES5 constructs like classes etc. |
|
I think it would be worth it. In my eyes, two very important issues arise when using ES5. First off, most instructions online nowadays are ES6. Documentation, tutorials, you name it. Second, when getting a job, having ES6 in your projects is miles better than ES5. Will it matter all the time? Absolutely not. But when it does matter, it's important. I've seen people get passed on jobs because "Why are they still writing ES5?" Related to the fact that most things about React are in ES6 now, teaching someone something in ES5 is just delaying the inevitable. It's an improvement, and if you're a newbie and starting from the ground up, learning best practices and the tricks for ES6 are easiest right now, instead of learning ES5, and then having to go and figure out ES6 as well. |
|
@justinformentin I kind of disagree. I cling to ES5 because there is a lot less magic. I find myself having to paste ES6 blobs of code into the Babel REPL to see what it transpiles to. It's kind of refreshing that this repo shows React in an alternative fashion that has less tricks. But, you aren't wrong that the world has left ES5 behind and is ES6 focused. I feel my opinion is an unpopular one. |
|
My assumption is: If you know ES6 then you know ES5, but not the other way around. So writing for ES6 would exclude people, but writing for ES5 wouldn't. |
10 Ejemplo de App, la numeración del título está mal, pero la corrijo yo ;) Muchas gracias !
|
Fff |
and others
While updating to React 16 I saw that some new lessons could be nice.
Styling is only implicitly touched.
Context wasn't a public API until version 16, but now it is.
Some patterns could be nice. Things like Dependency Injection, Higher Order Components and Render Props.
The text was updated successfully, but these errors were encountered: