JavaScript by example modern JavaScript programming with real world web apps

A project based guide to help you get started with web development by building real-world and modern web applications About This Book Learn JavaScript from scratch by building clones of popular web applications Understand the core concepts and techniques surrounding JavaScript with this power-packed...

Descripción completa

Detalles Bibliográficos
Otros Autores: S, Dani Akash, author (author)
Formato: Libro electrónico
Idioma:Inglés
Publicado: Birmingham, [England] ; Mumbai, [India] : Packt Publishing 2017.
Edición:1st edition
Materias:
Ver en Biblioteca Universitat Ramon Llull:https://discovery.url.edu/permalink/34CSUC_URL/1im36ta/alma991009630687206719
Tabla de Contenidos:
  • Cover
  • Title Page
  • Copyright
  • Credits
  • About the Author
  • About the Reviewer
  • www.PacktPub.com
  • Customer Feedback
  • Dedication
  • Table of Contents
  • Preface
  • Chapter 1: Building a ToDo List
  • System requirements
  • Text editor
  • Node.js
  • For Windows users
  • For Linux users
  • For Mac users
  • Google Chrome
  • ToDo List app
  • Chrome DevTools
  • Getting started with ES6
  • Arrow functions
  • let, var, and const
  • Loading the tasks from data
  • Template literals
  • Managing task status
  • Adding new tasks to the list
  • Adding tasks by hitting Enter button
  • Persisting data in the browser
  • Compatibility with older browsers
  • Node.js and npm
  • Setting up our development environment with Node and Babel
  • Shipping the code
  • Summary
  • Chapter 2: Building a Meme Creator
  • Initial project setup
  • Responsive designing with flexbox
  • Flexbox - a quick introduction
  • Designing the Meme Creator
  • Navigation bar
  • Content area
  • Webpack module bundler
  • Modules in JavaScript
  • Bundling modules in Webpack
  • Loaders in Webpack
  • Bundling Bootstrap in Webpack
  • Plugins in Webpack
  • Webpack dev server
  • Optimizing Webpack builds for different environments
  • Creating .env file in Windows
  • UglifyJsPlugin
  • PurifyCSSPlugin
  • ExtractTextPlugin
  • Cache busting
  • Clean dist folder before generating a new build
  • Source maps in production
  • Building the Meme Creator
  • Event handling
  • Rendering an image in the canvas
  • Reading a file using JavaScript
  • Rendering text on the canvas
  • Making a canvas responsive to show large images
  • Summary
  • Chapter 3: Event Registration App
  • Event - JS meetup
  • Initial project setup
  • Adding styles to the page
  • Validating and submitting the form using JavaScript
  • HTML forms
  • Reading form data in JavaScript
  • Form validation module.
  • Working with regular expressions in JavaScript
  • Submitting the form using&amp
  • #160
  • AJAX
  • Making network requests in JavaScript
  • What is a Promise?
  • Creating the API call module
  • Constructing the request details
  • Other network request methods
  • Back to the form
  • Adding charts to the website using Chart.js
  • Adding charts to the canvas elements
  • Setting up tab sections
  • Adding Google Maps to the web page
  • Adding Google Maps with a marker
  • Generating a production build
  • Shipping the code
  • Summary
  • Chapter 4: Real-Time Video Call App with WebRTC
  • Introduction to WebRTC
  • History of WebRTC
  • JavaScript WebAPIs
  • JavaScript WebRTC API
  • MediaStream
  • Using Adapter.js library
  • RTCPeerConnection and&amp
  • #160
  • RTCDataChannel
  • Building the Video Call application
  • Initial project setup
  • Adding styles to the page
  • Building the Video Call app
  • Creating a room
  • Adding participants to your room
  • Click to copy text
  • Joining a room
  • Setters and getters
  • Adding and removing videos
  • Selecting a video
  • Video Call in action
  • Summary
  • Chapter 5: Developing a Weather Widget
  • Can you build a Weather Widget?
  • Introduction to web components
  • HTML templates
  • HTML imports
  • Building the Weather Widget
  • Working of the Weather Widget
  • Retrieving the geolocation
  • Creating the weather custom element
  • Testing the custom element
  • Attaching a shadow DOM
  • Working with the custom element
  • Adding dependency modules
  • Retrieving and displaying weather information
  • Adding the current time to the widget
  • Responding to changes in element attributes
  • Using setters and getters
  • Fixing browser compatibility
  • Essential things to know
  • Summary
  • Chapter 6: Building a Blog with React
  • Why use a framework?
  • Selecting a framework
  • React
  • Immutable state
  • Props.
  • Building the Counter
  • The React crash course
  • Adding and managing states
  • Managing the state for the input field
  • Managing the state for the tasks
  • Adding new tasks
  • Preventing mutations using the spread syntax
  • Advantages of using React
  • Performance
  • Maintainability
  • Size
  • Building a blog with React
  • Creating the navigation bar
  • Implementing routing and navigation using React Router
  • The routes file
  • Adding routes in the app component
  • Managing history using withRouter
  • Proptype validation
  • Seamless navigation with NavLink
  • Blog home page
  • Using child components
  • Displaying post details
  • Adding a new blog post
  • Submitting the post
  • Generating production builds
  • Summary
  • Chapter 7: Redux
  • What is Redux?
  • Flux
  • Introduction to Redux
  • Store
  • Actions
  • Reducers
  • Implementing Redux in the blog
  • The folder structure
  • Initial state
  • Action types
  • Actions
  • Get all posts
  • Adding a new post
  • Reducers
  • The Root Reducer
  • Store
  • Connecting Redux with React components
  • The App component
  • Home component
  • Post component
  • The NewPost component
  • The Redux data flow
  • Persisting Redux store
  • Summary
  • Index.