Mais conteúdo relacionado

Similar a It ppt.pptx(20)



It ppt.pptx

  1. Front-End Development MEDICAPS UNIVERSITY CrystalTech Services Pvt. Ltd.
  2. What is Front-End Development Front-end web development, also known as client-side development is the practice of producing HTML, CSS and JavaScript for a website or Web Application so that a user can see and interact with them directly. The challenge associated with front end development is that the tools and techniques used to create the front end of a website change constantly and so the developer needs to constantly be aware of how the field is developing. The objective of designing a site is to ensure that when the users open up the site they see the information in a format that is easy to read and relevant. This is further complicated by the fact that users now use a large variety of devices with varying screen sizes and resolutions thus forcing the designer to take into consideration these aspects when designing the site. They need to ensure that their site comes up correctly in different browsers (cross-browser), different operating systems (cross-platform) and different devices (cross-device), which requires careful planning on the side of the developer.
  3. Web technologies A front-end developer architects and develops websites and applications using web technologies (i.e., HTML, CSS, DOM, and JavaScript), which run on the Open Web Platform or act as compilation input for non-web platform environments (i.e., React Native). Frontend frameworks are needed to facilitate the job of web developers: these software packages usually provide pre-written/reusable code modules, standardized front-end technologies, and ready-made interface blocks making it faster and easier for developers to craft sustainable web applications and UIs without coding every function or object from scratch.
  4. Web Technologies
  5. HTML: the key front-end technology HTML (or Hypertext Markup Language) is a computer language designed to create websites that later can be explored by anybody who accesses the Internet. HTML is normally employed to structure a web document. It defines such elements as headlines or paragraphs and enables embedding images, video, and other media HTML is composed of a series of shortcodes called tags, normalized into a text-file by a site creator. The text is then stored as an HTML file and observed through a browser. The browser scans the file and interprets the text into a visible form, and in the best case, renders the page as the designer had planned.
  6. CSS : Styling your facade CSS (or Cascading Style Sheets) is a style sheet language. It’s applied to define how HTML elements are supposed to be presented on a webpage in terms of design, layout, and variations for diverse devices with different screen sizes. CSS masters the layout of numerous different web pages at a time CSS frameworks. A CSS framework is a set of default CSS and HTML files. It extends a front-end developer’s capabilities for website design. In addition to assisting while building a responsive design, CSS frameworks also present distinct and symmetric layouts, saving developers from writing code from ground zero at every occasion.
  7. DOM: the web page structure The Document Object Model (DOM) is defined as a programming interface for HTML and XML documents. It interprets the page so that programs can modify the document structure, style, and content. The DOM renders the document as nodes and objects, enabling programming languages to connect to the page. The Document Object Model (DOM) represents this document so it can be modified. The DOM is an object-oriented representation of the web page, which can be altered with a scripting language like JavaScript.
  8. JavaScript: making the Web alive JavaScript (JS) is one of the most popular scripting languages. It’s mostly renowned for providing a full stack of technologies for both front-end and back-end development. As we are talking about the first one, it’s applied to make web pages dynamic. JS boosts a website’s overall interactivity. It enables modeling animated UI components such as image sliders, pop-ups, extensive site navigation menus, and more. JavaScript provides a website with extended functionality that isn’t otherwise achievable with HTML and CSS alone. JavaScript allows web pages to reply to users’ actions and dynamically refresh themselves.
  9. JavaScript: Frameworks and Libraries Frameworks are templates to create a website or a web application. They provide a structure (such as a skeleton or scaffolding) on which to arrange the whole project. While the framework sets the page templates, they build the structure with particular allocated areas to embed a framework code in. Libraries are sets of prewritten code snippets used and reused to implement core features of JavaScript. The snippet can be easily integrated into an existing project code when necessary.
  10. Javascript Frameworks
  11. React or Angular Angular is a front-end framework powered by Google that is compatible with most of the common code editors. Angular is intended to create dynamic, single-page web applications (SPAs), and progressive web-apps. React is an open-source library for building dynamic user interfaces, born and bred by Facebook. The framework is applied to create web-applications with multiple dynamic components. It relies on JavaScript and JSX, a Facebook PHP language extension. React enables building reusable HTML elements for the front end. React also includes React Native, a dedicated cross-platform mobile development framework.
  12. Javascript Libraries
  13. jQuery, in turn, is aimed at controlling HTML documents. It has a simple API to control events and design animation in browsers. Aside from that, jQuery is applied to manipulate the Document Object Model (DOM) and serves as a plugin development tool as well. It also comes with a lighter cross-browser library, jQuery UI for a mobile framework jQuery Mobile and for graphic interface construction. D3.js is a data-driven library for data visualization. By tying temporary data to DOM and implementing data-driven changes to the document, the library enables managing data and making dynamic data visualizations. It can uphold and process large datasets and dynamic responses for interaction and animation. D3’s functional style permits code reusing and runs with CSV and HTML.
  14. Ember.js is a framework for SPAs, mobile, and desktop applications. It uses the model-view-view-model (MVVM) pattern. Ember tools enable designing a development environment, while its command- line interface gives tools for script automation. Three.js is a cross-browser JavaScript library and application programming interface (API) used to create and display animated 3D computer graphics in a web browser using WebGL. The source code is hosted in a repository on GitHub. p5.js is a client-side JS platform that empowers artists, designers, students, and anyone to learn to code and express themselves creatively on the web. It is based on the core principles of Processing.
  15. Thank You