The journey of mastering Magento 2 for Magento 1 developers – Mage Titans USA 2016

1. www.magetitans.com
#MageTitansUSA @MageTitans
GABRIEL GUARINOSenior Magento Certified Developer, Argentina
Magento 2 for Magento 1 developers: The journey of mastering Magento 2
AUSTIN 2016
@guarinomagento

2. • Web Developer since 2005
• Magento Developer since 2009
• All Magento Certifications (4x)
• I build my own productivity tools:
Mac-CLI: OS X command line tools for developers
Bash
Productivity: Personal Time Tracker app (free)
Objective-C + Swift
Santa Fe, Argentina
Gabriel Guarino
ABOUT ME
FULL-STACK MAGENTO CERTIFIED DEVELOPER

3. M1 M2
BEFORE THIS PRESENTATION

4. M1 M2.
AFTER THIS PRESENTATION

5. M1
M2

6. app/code/(community/local)/Sample/Module/
M1
app/design/frontend/rwd/default/ skin/frontend/rwd/default/
css scss js imagestemplatelayoutetcsqlBlock controllers Helper Model
M2
data
etc
app/locale/(en_US)/
Sample_Module.csv
app/etc/modules/
Vendor_Module.xml
lib/
Sample_Module
shell/
Sample/Module

7. app/code/(community/local)/Sample/Module/
M1
app/local/Sample/Module/
app/design/frontend/rwd/default/ skin/frontend/rwd/default/
css scss js imagestemplatelayoutetcsqlBlock controllers Helper Model
Block Console Controller etc Helper i18n SetupPlugin TestCron Model
M2
Observer view
data
Api
app/locale/(en_US)/
Sample_Module.csv
app/etc/modules/
Vendor_Module.xml
lib/
Sample_Module
etc
shell/
Sample/Module

8. MAGENTO CLI

9. MAGENTO CLI

10. SETTING DEVELOPER MODE

11. CLEARING CACHE

12. RUNNING DB UPGRADES

13. RUNNING RE-INDEX

14. ENABLING/DISABLING MODULE

15. CODE REVIEW

16. BLACK AND WHITE = BOILERPLATE CODE

17. DECLARING
MODULE

18. DECLARING MODULE
2
1
MAGENTO 1

19. DECLARING MODULE
2
1
MAGENTO 2

20. DECLARING MODULEMAGENTO 2
2
1

21. DECLARING MODULEMAGENTO 2
2
1

22. DECLARING MODULEMAGENTO 2
2
1

23. 2 COMMANDS TO RUN
php bin/magento module:enable Sample_Module
ENABLE MODULE
01
02 php bin/magento setup:upgrade
UPGRADE DATABASE

24. 2 COMMANDS TO RUN
php bin/magento module:enable Sample_Module
ENABLE MODULE
01

25. 2 COMMANDS TO RUN
php bin/magento module:enable Sample_Module
ENABLE MODULE
01

26. 2 COMMANDS TO RUN
php bin/magento setup:upgrade
UPGRADE DATABASE
02

27. 2 COMMANDS TO RUN
php bin/magento setup:upgrade
UPGRADE DATABASE
02

28. SHELL
SCRIPT

29. SHELL SCRIPT
1
MAGENTO 1

30. SHELL SCRIPT
2
1
MAGENTO 2

31. SHELL SCRIPT
2
1
MAGENTO 2

32. SHELL SCRIPT
2
1
MAGENTO 2

33. SHELL SCRIPT
2
1
MAGENTO 2

34. SHELL SCRIPT
2
1
MAGENTO 2

35. SHELL SCRIPT
2
1
MAGENTO 2

36. NEW COMMAND

37. HELPER

38. HELPER
1
MAGENTO 1
2

39. HELPER
1
MAGENTO 2

40. HELPER
1
MAGENTO 2

41. HELPER
1
MAGENTO 2

42. HELPER
1
MAGENTO 2

43. DEPENDENCY INJECTION
IN MAGENTO 2

44. DEPENDENCY INJECTION
IN MAGENTO 2

45. DEPENDENCY INJECTION
IN MAGENTO 2

46. DEPENDENCY INJECTION
IN MAGENTO 2

47. INSTALL /
DATA INSTALL
SCRIPT

48. INSTALL / DATA INSTALL SCRIPT
1
MAGENTO 1
2A
2B

49. INSTALL / DATA INSTALL SCRIPT
1B
1A
MAGENTO 2

50. INSTALL / DATA INSTALL SCRIPT
1B
1A
MAGENTO 2

51. UPGRADE /
DATA UPGRADE
SCRIPT

52. UPGRADE / DATA UPGRADE SCRIPT
1
MAGENTO 1
2A
2B

53. UPGRADE / DATA UPGRADE SCRIPT
1B
1A
MAGENTO 2

54. UPGRADE / DATA UPGRADE SCRIPT
1B
1A
MAGENTO 2

55. UPGRADE SCRIPTS: MAGENTO 1 VS MAGENTO 2

56. 01
INSTALL AND UPGRADE SCRIPTS IN
MAGENTO 2
php bin/magento setup:upgrade
REQUIRED COMMAND
02 setup_module instead of core_resource
NEW TABLE FOR VERSION NUMBER

57. MODEL

58. 1
MAGENTO 1
2
3
4
MODEL

59. MODELMAGENTO 2
2
1
3

60. EVENT
OBSERVER

61. EVENT OBSERVER
1
MAGENTO 1
2

62. EVENT OBSERVER
1
MAGENTO 1
2

63. app/local/Sample/Module/
etc/ frontend/
adminhtml/
events.xml
events.xml
events.xml
MAGENTO 2
EVENT OBSERVER
XML CONFIGURATION FILE

64. EVENT OBSERVERMAGENTO 2
2
1

65. EVENT OBSERVERMAGENTO 2
2
1

66. EVENT NODE
events.xml

67. EVENT NODE
events.xml

68. EVENT OBSERVERMAGENTO 2
2
1

69. OBSERVERS: MAGENTO 1 VS MAGENTO 2

70. PLUGIN
before • after • around

71. PLUGINinterception

72. PLUGIN
before after around
execution
before
observed method
after
observed method
before and after
observed method
modify
original arguments
✓ ✗ ✓
modify
returned values
✗ ✓ ✓

73. PLUGINMAGENTO 2
2
1

74. PLUGINMAGENTO 2
2
1

75. PLUGINMAGENTO 2
2
1

76. PLUGINMAGENTO 2
2
1

77. PLUGINMAGENTO 2
2
1

78. PREFERENCE

79. PREFERENCE
etc/di.xml

80. PREFERENCE
etc/di.xml

81. CONTROLLER

82. FRONT-END CONTROLLER
2
1
MAGENTO 1

83. app/local/Sample/Module/
etc/
frontend/
adminhtml/
routes.xml
routes.xml
MAGENTO 2
CONTROLLER
XML CONFIGURATION FILE

84. CONTROLLERMAGENTO 2
1
2

85. ROUTER NODE
routes.xml
FRONT-END
CONTROLLER
ADMIN
CONTROLLER

86. ROUTER NODE
routes.xml
FRONT-END
CONTROLLER
ADMIN
CONTROLLER

87. CONTROLLERMAGENTO 2
1
2

88. CONTROLLERMAGENTO 2
1
2

89. CONTROLLERS: MAGENTO 1 VS MAGENTO 2

90. SCSS LESS
+
CSS

91. SCSS / CSSMAGENTO 1
2
1

92. SCSS COMPILATION

93. SCSS / CSS
2
1
MAGENTO 1

94. LESS AND CSSMAGENTO 2
1
2

95. LESS AND CSSMAGENTO 2
1
2

96. LESS AND CSSMAGENTO 2
1
2

97. SET DEVELOPER MODE

98. SET WORKFLOW TYPE

99. LESS AND CSSMAGENTO 2
1
2

100. JAVASCRIPT

101. JAVASCRIPT
2
1
MAGENTO 1
3

102. MAGENTO 1 JAVASCRIPT

103. REQUIRE JS

104. MAGENTO 2 JAVASCRIPT

106. JAVASCRIPT
IN MAGENTO 2
METHOD 1
data-mage-init
METHOD 2
text/x-magento-init

107. JAVASCRIPT
IN MAGENTO 2
METHOD 1
data-mage-init

108. JAVASCRIPT
IN MAGENTO 2
METHOD 1
data-mage-init

109. JAVASCRIPT
IN MAGENTO 2
METHOD 1
data-mage-init

110. JAVASCRIPT
IN MAGENTO 2
METHOD 2
text/x-magento-init

111. JAVASCRIPT
IN MAGENTO 2
METHOD 2
text/x-magento-init

112. JAVASCRIPT
IN MAGENTO 2
METHOD 2
text/x-magento-init

113. JAVASCRIPT
IN MAGENTO 2
METHOD 2
text/x-magento-init

114. JAVASCRIPT
IN MAGENTO 2
CUSTOM JS FILE

115. JAVASCRIPT
IN MAGENTO 2
CUSTOM JS FILE

116. JAVASCRIPT
IN MAGENTO 2
CUSTOM JS FILE

117. JAVASCRIPT - 1MAGENTO 2
1
2

118. JAVASCRIPT - 2MAGENTO 2
1
2

119. REMOVE PUB/STATIC FILES

120. REMOVE PUB/STATIC FILES

121. FINAL
CONCLUSION

122. ALL
YOU NEED
IS
CODE

123. MAGENTO 2 CODEBASE

124. MAGENTO 2 CODE SAMPLES

125. M2 DEVELOPER DOCUMENTATION

126. BUILD YOUR LIBRARY OF CODE SAMPLES

127. THANK YOU!
guarinogabriel@gmail.com
@GuarinoMagento
github.com/guarinogabriel