JSFoo: round the year submissions

Submit talks on JavaScript and full stack engineering round the year

React meets Angular - Using React components inside your Angular apps.

Submitted by Anirudh Varma (@anirudhvarma12) on Tuesday, 29 May 2018

videocam_off

Technical level

Intermediate

Section

Full Talk

Status

Submitted

Vote on this proposal

Login to vote

Total votes:  +3

Abstract

The talk is about using ReactJS components inside Angular applications. It is intended for those who are familiar with either React or Angular at a beginner level and those who are working on large scale Angular apps but want may find React to be the right choice for a particular use case.

The key takeaways for the audience would be -
1. Why would one use React inside Angular apps.
2. Bundling and using the React component.
3. Sharing state between Angular & React using Redux.
4. Keeping the bundle size of the Angular app in check by Lazy Loading modules.

Outline

  1. A brief overview of Angular & React, how Angular is different than React.
  2. Our motivation to use a React component inside our Angular app.
  3. Building the React component. Experiences with Create-React-App & NWB.js
  4. Exporting the React component, using Webpacks multiple entry points to break up the exported code into smaller pieces.
  5. Using Redux to share state between the Angular app & the React component. Using reducers, actions & angular-redux.
  6. Mounting the React app & cleanup.
  7. Putting the Angular app on diet, isolating the React code by using Lazy Loaded modules.

Speaker bio

I am a Front-End developer at SpotDraft. For over 4 years, I have worked as a Full Stack Developer working with Java, Python on the backend & React, Angular as well as plain old jQuery on the front-end. During my brief stint as a Freelancer, I also worked on mobile development projects.

At SpotDraft, I work primarily on the Front-End working with Angular, RxJS & React.

Links

Comments

Login with Twitter or Google to leave a comment