JavaScript AngularJS

There are many kinds of JavaScript frameworks. AngularJS is getting popular among web developers these days. It has an amazing data binding function.
http://angularjs.org/

 ------------------------------------------------------
[Index.html]
<!DOCTYPE html>
<html lang="en" ng-app>
<head>
    <meta charset="UTF-8">
    <title>Anjular JS test</title>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.3/angular.min.js"></script>
    <script src="testscript.js"></script>
</head>
<body>
       <div ng-controller="mainCtrl">
    <ul>
        <li ng-repeat="usr in users|filter:query">
            {{$index+1}} {{usr.name|uppercase}} {{usr.score}}
        </li>
    </ul>
    </div>
</body>
------------------------------------------------------
[testscript.js]
 var mainCtrl = function($scope) {
    $scope.users = [
        {"name":"Nick", "score":88.22},
        {"name":"Ken", "score":58.13},
        {"name":"Hiro", "score":98.54},
        {"name":"Jon", "score":45.22},
        {"name":"Lyn", "score":90.13},
        {"name":"Nate", "score":34.54},
    ];
}
------------------------------------------------------

jQuery funnyText.js

If you want to use fancy stuff on your websites, check out this jQuery plugin. This is fun!
http://alvarotrigo.com/funnyText/

JavaScript Contact form

When you need to use simple contact form, try this code.
------------------------------------------------------------------------------------------
<script language=javascript>
function send_mail(){  
    document.form1.action="mailto:example@mail.com";  
    document.form1.method="post";    document.form1.encoding="text/plain";
    alert("Thank you");
}
</script>
------------------------------------------------------------------------------------------
 <FORM name="form1" onSubmit="send_mail()">
<TEXTAREA rows="5" cols="80" name="text"></TEXTAREA><br />
<INPUT TYPE="submit" VALUE="Send">
<INPUT TYPE="reset" VALUE="Reset">
</FORM>
------------------------------------------------------------------------------------------

Free Social Media Icons

When you build a website, you often need to create links to social media such as Facebook and Twitter. You can get free sets of quality social media icons from good websites. Let's have a look!
http://vandelaydesign.com/blog/social-media/icons/

Site44 provides good web service

Site44 allows you to create sites inside your Dropbox account. You can try free starter plan and enjoy it.
http://www.site44.com/

CSS Trick text-shadow

You can make fonts glow using text-shadow properties.
-------------------------------------------------------------------------------

<Sample 1> Default(No text-shadow)

.test h3{

    color:white;
}

<Sample 2> Font with text-shadow

 .test h3:hover{

  text-shadow:
  0 0 20px #edf8ff,
  0 0 20px #edf8ff,
  0 0 0.80px #edf8ff;
}
-------------------------------------------------------------------------------

jQuery liScroll

This jQuery plugin has simple and useful scrolling effect. Visit the website and enjoy!
http://www.gcmingati.net/wordpress/wp-content/lab/jquery/newsticker/jq-liscroll/scrollanimate.html

jQuery diamonds.js

This is awesome jQuery
http://mqchen.github.io/jquery.diamonds.js/

Drupal7 DrupalStreamWrapperInterface

DrupalStreamWrapperInterface has over 20 functions to be defined by the implementing classes.
Visit the following website for the details of it.
https://api.drupal.org/api/drupal/includes!stream_wrappers.inc/7
http://php.net/manual/en/streamwrapper.stream-open.php

Drupal7 File interface

File API functions are quite handy to handle file system. Refer to the API documentation!
https://api.drupal.org/api/drupal/includes!file.inc/group/file/7

Drupal7 function drupal_get_path

This hook allows you to get the path of the module providing the file.
https://api.drupal.org/api/drupal/includes!common.inc/function/drupal_get_path/7

Drupal7 EntityFieldQuery

Drupal provides a query builder for SQL databases and a query builder for Entities and Fields.
The class is EntityFieldQuery which allows you to manage entities based on entity properties.
https://api.drupal.org/api/drupal/includes!entity.inc/class/EntityFieldQuery/7
---------------------------------------------------------------------------
$query = new EntityFieldQuery();
$query
->entityCondition('entity_type', 'car')
->propertyOrderBy('created', 'DESC')
->fieldCondition('field_price', 'value', '30000')
->range(0, 5);
$result = $query->execute();
---------------------------------------------------------------------------

Drupal7 Field API

The Field API is a great way to get yourself involved directly in Drupal core development
When you develop Drupal, you will realizethe Field API is a very important concept to get more control over module development. For more details see the following websites.
https://api.drupal.org/api/drupal/modules!field!field.module/group/field/7
https://api.drupal.org/api/drupal/developer!topics!forms_api_reference.html/7
https://drupal.org/node/707832

Drupal7 Schema API

You can manipulate the tables in Drupal's SQL database using the Schema API.
https://drupal.org/developing/api/schema
https://api.drupal.org/api/drupal/includes!database!schema.inc/group/schemaapi/7

Drupal7 function hook_tokens

To understand the concept of token is very important. Let's check it out!
https://api.drupal.org/api/drupal/modules!system!system.api.php/function/hook_tokens/7

Drupal7 function drupal_set_message

This hook allow you to set a message which reflects the status of the performed operation.
https://api.drupal.org/api/drupal/includes!bootstrap.inc/function/drupal_set_message/7

Drupal7 Form API

Drupal's Form API is definitely amazing. It allows developers to build forms and handle form submissions easily. That obviously saves your time and energy.
https://api.drupal.org/api/drupal/developer!topics!forms_api_reference.html/7

php PHP type comparison tables

It's very important to understand php types and comparison operators. Because some are very tricky and confusing, you should practice a lot until you get used to them.
http://www.php.net/manual/en/types.comparisons.php

Drupal7 Database API

Database API allows you to use database systems like Oracle, MSSQL, and SQLite with much less work. You can learn the Database API and work with it when you develop your own module.
https://drupal.org/node/310069
http://codekarate.com/daily-dose-of-drupal/drupal-7-module-development-part-7-database-api-displaying-data

Drupal7 function Render

It renders structured array into HTML or text using drupal_render(). It's really useful for developers to understand this function. It's worth to spend time to check the websites.
https://api.drupal.org/api/drupal/includes!common.inc/function/render/7
http://www.slideshare.net/frandoh/the-render-api-in-drupal-7
https://drupal.org/node/930760

php Scope Resolution Operator (::)

If a class doesn't have any instances, Scope Resolution Operator (::) is quite handy because it allow you to refer to functions and variables in the class.
http://php.net/manual/en/keyword.paamayim-nekudotayim.php
-------------------------------------------------------------------------------------------
class A
{
  function example()
  {
    echo “A::example().”;
  }
}
A::example(); // Correct

A->example();// Wrong because class A does not have any instance yet!
------------------------------------------------------------------------------------------- 

Object-oriented Programming (OOP) in PHP

You can find a few areas of PHP's Object-oriented features in Drupal. One is the database API, another is the testing framework which uses class inheritance to declare tests. Because these features are not using advanced Object-oriented Programming, you just need to know the basics. Anyway, learning Object-oriented Programming is quite useful. Just have a look!
http://us3.php.net/manual/en/language.oop5.php

Resource Description Framework

RDF is a general method to encoding metadata and other knowledge on the Semantic Web, with some rules about the semantics, or meaning, of those pieces. The point is to have a method so simple that it can express any fact. It's not easy to understand completely. Read the following websites carefully and try to use it until you get used to it.
http://en.wikipedia.org/wiki/Resource_Description_Framework
https://drupal.org/project/rdf
https://drupal.org/module-categories/rdf
http://www.lullabot.com/blog/article/how-does-rdf-work-drupal-7

Drupal7 Entities

In Drupal 7, "Entity" is very a important term whose concept is difficult to understand at the first time. Entities can be used as the parent class of nodes. They are the abstraction of functionality common between Nodes, Taxonomy Terms, and Users (among others).
https://drupal.org/node/1261744
https://drupal.org/project/entity
http://evolvingweb.ca/story/drupal-7-entities-what-are-they-and-what-are-they-good

Drupal7 system_settings_form()

This hook adds a button and setting forms, which allow you to configure the setting.
https://api.drupal.org/api/drupal/modules!system!system.module/function/system_settings_form/7
https://drupal.org/node/206761

function test_admin_settings() {
$form = array();
// Test output visibility settings.
    $form['display'] = array(
        '#type' => 'fieldset',
        '#title' => t('Display options'),
    );
    $form['display']['test_display_section_summaries'] = array(
        '#type' => 'checkbox',
        '#title' => t('Show summaries on administration sections.'),
        '#default_value' => variable_get('test_display_section_summaries', 1),
        '#description' => t('If unchecked, the summaries will still be visible on the <a href="@test-overview">reports</a> page.',
        array('@xray-overview' => url('admin/reports/xray'))
    ),
    );
    $form['display'][test_display_callback_function'] = array(
        '#type' => 'checkbox',
        '#title' => t('Show the page callback function on all pages.'),
        '#default_value' => variable_get('test_display_callback_function', 1),
    );
    $form['display']['test_display_form_id'] = array(
        '#type' => 'checkbox',
        '#title' => t('Show form ID in forms.'),
        '#default_value' => variable_get('test_display_form_id', 1),
    );
    return system_settings_form($form);
}

Drupal7 drupal_get_form()

This hook needs to be given an identifier for a form. It returns a renderable form structure as an array of arrays from the given identifier.
https://api.drupal.org/api/drupal/includes!form.inc/function/drupal_get_form/7

Drupal7 hook_theme

This hook can register theme's implementation to make modules and themes work together. It defines how to render array of the theme as HTML. It might be complex, but very important to know to have more control over theming.
https://api.drupal.org/api/drupal/modules!system!system.api.php/function/hook_theme/7
https://drupal.org/node/933976 

Drupal7 Recommended Locations for Custom Modules

When you develop a new module, you should put the folder in the following paths.

l: sites/all/modules/custom/
 For a single site or to be available for all sites in a multisite installation.

2: sites/example.com/modules/custom/
To be available for only one site, example.com, in a multisite installation.

3: sites/default/modules/
Acceptable shortcut location for custom modules when using a single-site installation.

Drupal7 hook_menu

Hook_menu enables modules to register paths which define how to handle URL. This hook is used very often in .module file. You should deeply understand it.
https://api.drupal.org/api/drupal/modules!system!system.api.php/function/hook_menu/7

JavaScript D3.js sample code

 Here's the sample code of D3.js. Create a html file and paste the following code in the file.
--------------------------------------------------------------------------------
<!DOCTYPE html>
<html lang="en">
<head>
    <title>D3.js sample</title>
</head>
<body>
    <script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>
    <script>

    var circleData = [64, 48, 85, 36, 51];

    var w = 1000;
    var h = 400;

    var svg = d3.select("body").append("svg").attr({width:w, height:h});

    svg.selectAll("circle")
        .data(circleData)
        .enter()
        .append("circle")
        .transition()
        .delay(function(d, i){return i*1000})
        .duration(2000)
        .ease("bounce")
        .each("start", function() {
            d3.select(this).attr({
                fill:"green",
                r:0,
                cy:h
            });
        })
        .attr({
            cx: function(d, i) {return 150 + (i * 200);},
            cy: h/2,
            r: function(d) { return d;},
            fill:"red"
        })
        .each("end", function() {
            d3.select(this)
                .transition()
                .duration(1500)
                .attr({
                    fill:"blue",
                    r:0,
                    cy:0
            })
        });

    </script>
</body>
</html>  
-------------------------------------------------------------------------------- 

Drupal7 Coder

Coder module checks source code of your Drupal site and show possible errors and warnings. 
Download and enable the Coder and go to Administration > Configuration> Development > Coder.

https://drupal.org/project/coder

https://drupal.org/node/144172