Learn how to write efficient code using Mixins in JavaScript & CSS.

1. Mixins & OOPS
- Rahul Sharma

2. A group of something that lets you reuse itself throughout your main thing to
avoid redundancy.
What ?
Who ?
Why ?
Where ?When ?

3. CSS Mixins

4. Old School
Code
repetition

5. New School
Reusable Code

6. SCSS

7. J-SOOPS

8. Object An Object is a unique entity which contains property and methods. An Object is an
instance of a class.
Object Constructor
Object Literal

9. Class then….

10. Class now….

11. Encapsulation

12. Abstraction

13. Inheritance

14. Polymorphism A call to member function will cause a different function
to be executed depending on the type of object that
invokes the function.

15. JS Mixins

16. Example please?

17. What if Ram is a PHD
Student as well??
Multiple Inheritance ?

18. Multilevel Inheritance
PHD Student
Employee
Person

19. Mixin to the rescue!
mixinModule.js

21. References
● https://en.wikipedia.org/wiki/Mixin
● https://javascript.info/mixins
● https://sass-lang.com/documentation/at-rules/mixin
● https://marksheet.io/sass-mixins.html
● https://blog.bitsrc.io/understanding-mixins-in-javascript-de5d3e02b466
● https://en.wikipedia.org/wiki/Mixin
● https://devhints.io/sass