insin / react-hn

React-powered Hacker News client
https://insin.github.io/react-hn
Other
2.18k stars 329 forks source link

Anyone up for creating a guide/tutorial of creating this PWA from scratch? #57

Open jasan-s opened 8 years ago

addyosmani commented 8 years ago

The approach we took to this PWA was taking an existing codebase and iteratively adding in features like offline (w/Service Worker), SSR and so on to it. I'm working on a rough guide to that. I think there's an interesting story to tell about how to migrate codebases that aren't new there.

@insin might have some articles he wrote with learnings about the core ReactHN part (or might have some planned). It's a lovely complex app. We'd have to check :)

crazyyi commented 6 years ago

@addyosmani Can you explain the design philosophy of this project? Just an architecture diagram maybe enough. I have learned from this project and managed to implement most of the client but is totally different from this project. My implementation is more basic and straightforward but lacking separation of logic in the components whereas this project is more scalable.

I find this project uses very complicated structure to separate logic between components which I don't know how to start. And because the code in this project is implemented using ES5, it is not easy to extract useful information about the architecture based on the source code.

insin commented 6 years ago

Does this count? https://medium.com/@jbscript/lazy-live-data-with-react-79ed1cb1f4d6

crazyyi commented 6 years ago

@insin Thanks the blog focuses more on updating live data with firebase. But I just want to get the basic things worked first. I haven't used firebase before. And now react's new version tells us not to use Mixins. So I won't use 'react-firebase' (like that in react-hn) now. I might use something like re-base. But do I need an API key?