Changes

Jump to navigation Jump to search
2,248 bytes added ,  07:28, 29 May 2019
m
To cater to more recent Angular framework, rather than AngularJS
Line 1: Line 1: −
Yes we all love the web. Google, Facebook,  Amazon all started as websites before growing to what they are now. We have all dreamed about having our own huge website. This page will help you get there.
+
Yes we all love the web. Google, Facebook,  Amazon all started as websites before growing to what they are now. We have all dreamed about having our own huge website. This page will help you get there. If you are looking for particular tutorials, have a look at [[Software_Library_Guides#Web_Development|Web Development Guides]].
    
== Front-end vs Back-end ==
 
== Front-end vs Back-end ==
Line 5: Line 5:  
* '''Front-end''' - Everything that is visible to you when you open a webpage is a piece of code (HTML file) sent to your browser which is interpreted real-time by your browser. This includes rendering all your styles, displaying text in an organised manner, animations, responsiveness and contacting the server for data.
 
* '''Front-end''' - Everything that is visible to you when you open a webpage is a piece of code (HTML file) sent to your browser which is interpreted real-time by your browser. This includes rendering all your styles, displaying text in an organised manner, animations, responsiveness and contacting the server for data.
 
* '''Back-end''' - The code running on the server which you cannot see as a user. This code is used to generate HTML files, send files and JSON data when requested by front-end.  
 
* '''Back-end''' - The code running on the server which you cannot see as a user. This code is used to generate HTML files, send files and JSON data when requested by front-end.  
 +
* '''Full Stack''' - The combination of front-end and back-end development.
    
As an example, the search bar on Google is the front-end, and the algorithm which searches for results is the back-end.
 
As an example, the search bar on Google is the front-end, and the algorithm which searches for results is the back-end.
Line 27: Line 28:  
Why? It's slow, inefficient, leads to dirty code, old fashioned and worst of all not cool. After learning the basics, you should seriously consider learning one of these languages if you want to stay in web development.
 
Why? It's slow, inefficient, leads to dirty code, old fashioned and worst of all not cool. After learning the basics, you should seriously consider learning one of these languages if you want to stay in web development.
 
* '''JQuery''' - a much better way to write JS code, makes animation seamless.
 
* '''JQuery''' - a much better way to write JS code, makes animation seamless.
* '''AngularJS''' - Google's own framework for web development. Very clean code, gets several common scripting jobs done with barely any code. Easy to extend and modify existing templates.
+
* '''Angular''' - Google's own framework for web development. Very clean code, gets several common scripting jobs done with barely any code. Easy to extend and modify existing templates.
 
* '''ReactJS''' - Hailing from Facebook's labs, this is the modern web developer's paradise. Very fast rendering, easy to write JS / JSX code.
 
* '''ReactJS''' - Hailing from Facebook's labs, this is the modern web developer's paradise. Very fast rendering, easy to write JS / JSX code.
 +
* '''Sass''' - A language in itself which translates to CSS. It makes styling a lot easier and a lot more fun!
    
== Monsters of Back-end ==
 
== Monsters of Back-end ==
 +
Back-end coding can be done in a variety of languages such as Python, PHP, Ruby and even JavaScript! Some common frameworks used in the back-end are
 +
* [http://www.php.net/ PHP]- is a server-side scripting language which can be embedded within HTML as well. Even though this language is thoroughly criticized today, it still powers most of the web.
 +
* [https://nodejs.org/en/ Node.js] (JavaScript)- is a server-side implementation of the JavaScript language. It is becoming increasingly popular lately. We have a tutorial on [[Node.js]].
 +
* [https://en.wikipedia.org/wiki/Flask_(web_framework) Flask] (Python) - An excellent library to carry out fast and effective back-end development. The equivalent of NodeJS in Python.
 +
=== REST APIs ===
 +
In your experience, you would come across applications offering a service known as a [https://en.wikipedia.org/wiki/Representational_state_transfer REST] API. To get a hands-on experience to this concept, see our article on [[RESTful]] method.
   −
== Modern Web Development ==
+
== Full Stack Frameworks ==
 +
* '''MEAN Stack''' - A collection of JavaScript-based technologies — MongoDB, Express.js, AngularJS and Node.js — used to develop web applications. From the client and server sides to databases, MEAN is a full-stack development toolkit. Here is a great [https://blog.udemy.com/node-js-tutorial/ tutorial ] to get you started.
 +
* [https://www.djangoproject.com/ Django] (Python)- is a high-level Python Web framework that encourages rapid development and clean, pragmatic design. It takes care of much of the hassle of Web development, so you can focus on writing your app without needing to reinvent the wheel.<br>
 +
We have a [[Django]] tutorial to get you started.
   −
== Full Stack Frameworks ==
+
== See also ==
 +
* [http://wncc-iitb.org/wiki/index.php/Django Django]
 +
* [http://wncc-iitb.org/wiki/index.php/Web_Scraping Web Scraping]
 +
* [http://wncc-iitb.org/wiki/index.php/Drupal Drupal]
 +
* [http://wncc-iitb.org/wiki/index.php/Beautiful_Soup Beautiful Soup]
 +
* [https://frontendchecklist.io/ Front End Checklist]
9

edits

Navigation menu