README.md

CBER Web Development Notes

This repository was set up to collect important general information and issues related to the web development work at the Ball State University Center for Business and Economic Research.

If there are any issues that apply to a large number of CBER's websites or none of them in particular, they should go here.

Services

All websites need the following:

• A GitHub repo under the BallStateCBER organization
• Unit testing and code sniffing with Travis CI) (with a badge inREADME.md)
• Testing with Code Climate (with badges in README.md)
• GitHub, Travis, and CodeClimate events in the #webdev channel of cber.slack.com

Frameworks

• CakePHP 4.x
• Bootstrap 4.x

PHP standards

• CakePHP code sniffer standards (extension of PSR-12)
• Test with PHP_CodeSniffer
• Use camelCaps for variable names instead of underscored_names
• Avoid prefixing method names with underscores
• Store sensitive information (and information that changes based on environment) in .env or config/app_local.php files that are not committed
• Indent with four spaces
• Avoid using any deprecated code from libraries (so migrating to the next major version will be easier)

HTML standards

• HTML5
• Test with W3C Markup Validation Service
• Where possible, hyphenate class names and element IDs instead of using underscores or camelCaps
• Indent with four spaces

Template file standards

• Use short echo tags when not in a multiple-line block of code, e.g.

   <a href="<?= $url ?>">
       <?= $label ?>
   </a>

  or

   <a href="http://example.com">
       <?php
           $foo = getFoo();
           $bar = getBar($foo);
           echo ucwords($bar);
       ?>
   </a>

• Declare $this and other variables in opening doc comment, e.g.

  <?php
      /**
       * @var \App\View\AppView $this
       * @var \App\Model\Entity\Survey $survey
       * @var \App\Model\Entity\Community $community
       */
  ?>

  Some of these can be automatically added by dereuromark/cakephp-ide-helper

CSS (and preprocessor) standards

• Google style guide
• Test with W3C CSS Validation Service
• Sass for preprocessing

JavaScript standards

• JavaScript Standard Style
• Google JavaScript Style Guide for any matter not covered by the JavaScript Standard Style
• Lint with ESLint
• Avoid the use of jQuery except when implementing jQuery plugins that have no practical vanilla JS alternative

Consideration for future standards

• Stickler CI
• Webpack
• React
• Babel
• TypeScript