Learning Magento Coding Standard in Detail

1
(No Transcript)
2
About VDC
Over 8 years 1800 projects, VDC is a full
service ECommerce Web Development Online
Marketing Agency that provides value added
services at affordable rates to numerous small,
medium large size of businesses across the
world. Deliver 247 uptime and responsive
digital commerce solutions that allow businesses
to offer remote access of their professional
offerings. VDC is an offshore web development
online marketing center with agile approach of
development.
www.vihadigitalcommerce.com
3
Learning Magento Coding Standard in Detail
When it comes to Magento development Magento core
developers need to follow certain Magento code
demarcation standards. The article would discuss
those standards suggested by 3rd party extension
developers. These standards were developed to
ensure the following aspects Dissociate visual
(CSS) layer from the specific functional
(JavaScript) layer. Dissociate functional
(JavaScript) layer from the HTML
(markup). Semantics You need to use meaningful,
shortened lowercase words consisting of Latin
characters linked with (-) hyphen. A Semantic
representation can be dependent on ID attribute
www.vihadigitalcommerce.com
4

• Encourages engineers to focus on the page
  components that can be used again rather than
  separate singleton components.
• Here you need to follow the dissociation of
  presentation content methodology.
• The list given below will let you differentiate
  between the exact meaning of any document and the
  way this meaning is portrayed to the readers.
• Content (Semantics) comprises
• Data
• logic
• model
• Presentation comprises of
• graphics
• aesthetic
• view

www.vihadigitalcommerce.com
5

• Code Demarcation
• Here, the visual presentation should be based on
• CSS pseudo-classes
• HTML class attributes
• HTML tags
• In JavaScript files, you should not implement
  hard code CSS styles
• Exception is
• CSS attributes wherein the values should be
  calculated values must be calculated after
  CSS-topics/Less code.
• Makes it easy to alter to its default layout by
  including CSS classes to and then eliminate them
  from the elements.
• Remember, inside the HTML tags, do not utilize
  inline CSS styles

www.vihadigitalcommerce.com
6

• Business Logic JavaScript
• The business logic should be based on just the
  following
• Form
• Form element name attributes or
• Data attributes
• Here you need to allot HTML helper classes in
  your JavaScript to change the presentation layer
• It needs an underscore symbol to be used in the
  beginning and should be included in the
  lowercase.
• PHTML templates and PHP files
• You must not hard-code inline CSS styles in PHP
  classes

www.vihadigitalcommerce.com
7

• Reduces long-term maintenance efforts by having
  styles stored in one place.
• Makes debugging easy thereby reducing the count
  of files that needs modification.
• In PHP classes, avoid using hard-code inline
  JavaScript
• Decreases the efforts needed for long term
  maintenance by keeping frontend business logic
  saved simply at one place.
• The standard for PHP coding
• The team for Magento core development working
  with professional ecommerce development services
  makes use of this Magento coding standard.
• The Coding Standard for Magento offers certain
  rules that comprise of the below-mentioned points

www.vihadigitalcommerce.com
8

• Utilization of insecure functions
• PSR-1 PSR-2 compliance
• Unescaped output
• Code syntax for PHP code
• DocBlock Standard
• Talking about this particular standard is about
  requirements of Magento along with protocols for
  including inline code documentation, termed as
  DocBlocks.
• Possibility of the Standard
• The main objective of this standard is to merge
  code DocBlocks for the files not limited to a
  specific language.

www.vihadigitalcommerce.com
9

• The Standard for JavaScript Coding
• In this case, you need to use the ESLint rules of
  Magento to ensure the code written abides by
  coding standards of Magento.
• jQuery Library along with custom standard
  jQuery widgets
• When it comes to Magento Development Coding
  Standard for jQuery widget you need to check out
  the coding standard for jQuery.
• JSCS and Eslint Tools
• To make sure that you maintain the quality of
  JavaScript code, you need to use JSCS and ESLint
  tools
• ESLint
• It is a community-operated tool that identifies
  errors and possible issues in JavaScript code.

www.vihadigitalcommerce.com
10

• The Standard for JavaScript DocBlock
• If you have to include JavaScript code inline
  documentation, then follow the guidelines.
• You may find some sections of the guidelines do
  not abide by the standard, but it is under
  improvisation.
• Make use of JSDoc
• Inline comments need to be of the following type
  //
• Coding Standard for jQuery Widget
• In Magento, the jQuery UI widgets interactions
  are created on a reusable and simple base that
  jQuery UI Widget Factory.
• This factory offers a convenient base for
  creating complex plug-ins and also flexible API.

www.vihadigitalcommerce.com
11

• Less Coding Standard
• When elaborating on this standard, it can
  illustrate the internal Magento requirements for
  code styling, code formatting for developers
  team that creates CSS and Less code.
• Also, some sections of this Magento code may not
  abide by the standards of the code but it is
  still under improvisation. The improved outcome
  would happen gradually.
• Standard Rules
• About Indentation
• Only spaces to be used for indentation-
• Indent size four spaces
• Style Guide for HTML

www.vihadigitalcommerce.com
12

• This guide is about Magentos internal
  requirements particularly for HTML code style for
  those teams that are involved in the development
  of CSS and Less code.
• This guide is about Google HTML/CSS style guide
  including some modifications
• Indentations
• Spaces that should be used for indentation-
• Continuation indent four spaces
• The above coding standards should be followed by
  every professional and beginner in Magento
  development to get a clean and transparent code.

www.vihadigitalcommerce.com
13
Why You Choose to Work with VDC?

• One Stop eCommerce Development
• Highly Secure Website
• Certified Developers
• On-Time Delivery
• Instant Project Support
• Better ROI
• Full Client's Reviews
• 100 Transparent Work
• Full Satisfaction Guarantee

www.vihadigitalcommerce.com
14
Read the complete story follow the link below-
Learning Magento Coding Standard in Detail
Read Blog https//www.vihadigitalcommerce.com/blo
g/
www.vihadigitalcommerce.com
15
LET'S GET TOGETHER Start Discussion About Your
eCommerce Development Online Marketing Hassle-f
ree One Stop Solutions, Hire Us!
Website www.vihadigitalcommerce.com Skype
bdo3.magentoguys Email info_at_vihadigitalcommerce
.com Call 91 7096620202