Web Tooling & Automation

Brought by: Udacity

Overview

In this course, you’ll learn how to setup your development, get super productive during daily work and iteration, prevent yourself and your site from disasters and save a lot of time and effort with automatic optimization and automation. Finally, you’ll learn how to do all this while being confident your code runs on a multitude of devices in the real world.

Syllabus

  • Introduction
    • Being pragmatic vs. idealistic when choosing tools.,Identify the real value of the tool.,Keep things modular and replaceable.
  • Productive Editing
    • Set up your editor.,Install Sublime Text.,Install Plugins.
  • Powerful Builds
    • Getting started with Gulp.,Install gulp plugins.,Create gulp tasks.
  • Expressive Live Editing
    • Why live edit?,Approaches for live editing.,Testing with Browser Sync.
  • How to Prevent Disasters
    • Code correction with linting.,ESLint.,Unit testing in Gulp.
  • Awesome Optimizations
    • CSS concatenation.,JS concatenation and minification.,Sourcemaps.

Taught by

James Williams

Web Tooling & Automation
Go to course

Web Tooling & Automation

Brought by: Udacity

  • Udacity
  • Free
  • English
  • Certificate Not Available
  • Available at any time
  • intermediate
  • N/A
8.1.2PHP Version231msRequest Duration2MBMemory UsageGET en/courses/{slug}Route
    • Booting (135ms)
    • Application (95.37ms)
    • 1 x Booting (58.4%)
      134.65ms
      1 x Application (41.36%)
      95.37ms
      14 templates were rendered
      • public.courses.show (resources/views/public/courses/show.blade.php)3bladefile
        Params
        0
        course
        1
        links
        2
        config
      • public.courses.partials.breadcrumbs (resources/views/public/courses/partials/breadcrumbs.blade.php)6bladefile
        Params
        0
        __env
        1
        app
        2
        errors
        3
        course
        4
        links
        5
        config
      • public.courses.partials.heading (resources/views/public/courses/partials/heading.blade.php)7bladefile
        Params
        0
        __env
        1
        app
        2
        errors
        3
        course
        4
        links
        5
        config
        6
        classes
      • public.courses.partials.details (resources/views/public/courses/partials/details.blade.php)6bladefile
        Params
        0
        __env
        1
        app
        2
        errors
        3
        course
        4
        links
        5
        config
      • public.courses.partials.breadcrumbs (resources/views/public/courses/partials/breadcrumbs.blade.php)6bladefile
        Params
        0
        __env
        1
        app
        2
        errors
        3
        course
        4
        links
        5
        config
      • public.courses.partials.heading (resources/views/public/courses/partials/heading.blade.php)7bladefile
        Params
        0
        __env
        1
        app
        2
        errors
        3
        course
        4
        links
        5
        config
        6
        classes
      • public.layouts.main (resources/views/public/layouts/main.blade.php)6bladefile
        Params
        0
        __env
        1
        app
        2
        errors
        3
        course
        4
        links
        5
        config
      • public.layouts.partials.meta (resources/views/public/layouts/partials/meta.blade.php)6bladefile
        Params
        0
        __env
        1
        app
        2
        errors
        3
        course
        4
        links
        5
        config
      • public.layouts.partials.navbar (resources/views/public/layouts/partials/navbar.blade.php)6bladefile
        Params
        0
        __env
        1
        app
        2
        errors
        3
        course
        4
        links
        5
        config
      • public.auth.profile.partials.links (resources/views/public/auth/profile/partials/links.blade.php)6bladefile
        Params
        0
        __env
        1
        app
        2
        errors
        3
        course
        4
        links
        5
        config
      • public.auth.profile.partials.link (resources/views/public/auth/profile/partials/link.blade.php)8bladefile
        Params
        0
        __env
        1
        app
        2
        errors
        3
        course
        4
        links
        5
        config
        6
        route
        7
        title
      • public.auth.profile.partials.link (resources/views/public/auth/profile/partials/link.blade.php)8bladefile
        Params
        0
        __env
        1
        app
        2
        errors
        3
        course
        4
        links
        5
        config
        6
        route
        7
        title
      • public.auth.profile.partials.link (resources/views/public/auth/profile/partials/link.blade.php)8bladefile
        Params
        0
        __env
        1
        app
        2
        errors
        3
        course
        4
        links
        5
        config
        6
        route
        7
        title
      • public.layouts.partials.flash-session (resources/views/public/layouts/partials/flash-session.blade.php)6bladefile
        Params
        0
        __env
        1
        app
        2
        errors
        3
        course
        4
        links
        5
        config
      uri
      GET en/courses/{slug}
      middleware
      web, localize:en
      controller
      App\Http\Controllers\CourseController@show
      as
      en.courses.show
      namespace
      prefix
      /en
      where
      file
      app/Http/Controllers/CourseController.php:17-35
      7 statements were executed13.28ms
      • select * from `courses` where `slug_en` = 'web-tooling-&-automation' limit 1
        11.71ms/app/Http/Controllers/CourseController.php:20corspedia
        Metadata
        Bindings
        • 0. web-tooling-&-automation
        Backtrace
        • 17. /app/Http/Controllers/CourseController.php:20
        • 18. /vendor/laravel/framework/src/Illuminate/Routing/Controller.php:54
        • 19. /vendor/laravel/framework/src/Illuminate/Routing/ControllerDispatcher.php:43
        • 20. /vendor/laravel/framework/src/Illuminate/Routing/Route.php:260
        • 21. /vendor/laravel/framework/src/Illuminate/Routing/Route.php:205
      • update `courses` set `visitors` = `visitors` + 1, `courses`.`updated_at` = '2025-02-22 21:57:25' where `id` = 6834
        360μs/app/Http/Controllers/CourseController.php:21corspedia
        Metadata
        Bindings
        • 0. 2025-02-22 21:57:25
        • 1. 6834
        Backtrace
        • 17. /app/Http/Controllers/CourseController.php:21
        • 18. /vendor/laravel/framework/src/Illuminate/Routing/Controller.php:54
        • 19. /vendor/laravel/framework/src/Illuminate/Routing/ControllerDispatcher.php:43
        • 20. /vendor/laravel/framework/src/Illuminate/Routing/Route.php:260
        • 21. /vendor/laravel/framework/src/Illuminate/Routing/Route.php:205
      • select `id`, `name_en`, `name_ar`, `topic_id`, `slug_en`, `slug_ar` from `subjects` where `subjects`.`id` in (10)
        280μs/app/Http/Controllers/CourseController.php:23corspedia
        Metadata
        Backtrace
        • 20. /app/Http/Controllers/CourseController.php:23
        • 21. /vendor/laravel/framework/src/Illuminate/Routing/Controller.php:54
        • 22. /vendor/laravel/framework/src/Illuminate/Routing/ControllerDispatcher.php:43
        • 23. /vendor/laravel/framework/src/Illuminate/Routing/Route.php:260
        • 24. /vendor/laravel/framework/src/Illuminate/Routing/Route.php:205
      • select `id`, `name_en`, `name_ar`, `slug_en`, `slug_ar` from `topics` where `topics`.`id` in (1)
        260μs/app/Http/Controllers/CourseController.php:23corspedia
        Metadata
        Backtrace
        • 25. /app/Http/Controllers/CourseController.php:23
        • 26. /vendor/laravel/framework/src/Illuminate/Routing/Controller.php:54
        • 27. /vendor/laravel/framework/src/Illuminate/Routing/ControllerDispatcher.php:43
        • 28. /vendor/laravel/framework/src/Illuminate/Routing/Route.php:260
        • 29. /vendor/laravel/framework/src/Illuminate/Routing/Route.php:205
      • select * from `institutions` where `institutions`.`id` in (28) and `institutions`.`deleted_at` is null
        230μs/app/Http/Controllers/CourseController.php:23corspedia
        Metadata
        Backtrace
        • 20. /app/Http/Controllers/CourseController.php:23
        • 21. /vendor/laravel/framework/src/Illuminate/Routing/Controller.php:54
        • 22. /vendor/laravel/framework/src/Illuminate/Routing/ControllerDispatcher.php:43
        • 23. /vendor/laravel/framework/src/Illuminate/Routing/Route.php:260
        • 24. /vendor/laravel/framework/src/Illuminate/Routing/Route.php:205
      • select * from `providers` where `providers`.`id` in (6) and `providers`.`deleted_at` is null
        210μs/app/Http/Controllers/CourseController.php:23corspedia
        Metadata
        Backtrace
        • 20. /app/Http/Controllers/CourseController.php:23
        • 21. /vendor/laravel/framework/src/Illuminate/Routing/Controller.php:54
        • 22. /vendor/laravel/framework/src/Illuminate/Routing/ControllerDispatcher.php:43
        • 23. /vendor/laravel/framework/src/Illuminate/Routing/Route.php:260
        • 24. /vendor/laravel/framework/src/Illuminate/Routing/Route.php:205
      • select * from `html_files` where `html_files`.`id` = 6825 limit 1
        230μs/app/Models/Course.php:84corspedia
        Metadata
        Bindings
        • 0. 6825
        Backtrace
        • 21. /app/Models/Course.php:84
        • 28. view::public.courses.show:29
        • 30. /vendor/laravel/framework/src/Illuminate/Filesystem/Filesystem.php:125
        • 31. /vendor/laravel/framework/src/Illuminate/View/Engines/PhpEngine.php:58
        • 32. /vendor/laravel/framework/src/Illuminate/View/Engines/CompilerEngine.php:72
      App\Models\HtmlFile
      1
      App\Models\Provider
      1
      App\Models\Institution
      1
      App\Models\Topic
      1
      App\Models\Subject
      1
      App\Models\Course
      1
        _token
        RG5RBWfMBL2ybT5XSQgpmDzVDRjEV83EZCHlawx0
        locale
        en
        _previous
        array:1 [ "url" => "https://www.corspedia.com/en/courses/web-tooling-&-automation" ]
        _flash
        array:2 [ "old" => [] "new" => [] ]
        PHPDEBUGBAR_STACK_DATA
        []
        path_info
        /en/courses/web-tooling-&-automation
        status_code
        200
        
        status_text
        OK
        format
        html
        content_type
        text/html; charset=UTF-8
        request_query
        []
        
        request_request
        []
        
        request_headers
        0 of 0
        array:24 [ "sec-ch-ua-mobile" => array:1 [ 0 => "?0" ] "sec-ch-ua" => array:1 [ 0 => ""HeadlessChrome";v="129", "Not=A?Brand";v="8", "Chromium";v="129"" ] "cache-control" => array:1 [ 0 => "no-cache" ] "pragma" => array:1 [ 0 => "no-cache" ] "cdn-loop" => array:1 [ 0 => "cloudflare; loops=1" ] "priority" => array:1 [ 0 => "u=0, i" ] "upgrade-insecure-requests" => array:1 [ 0 => "1" ] "user-agent" => array:1 [ 0 => "Mozilla/5.0 AppleWebKit/537.36 (KHTML, like Gecko; compatible; ClaudeBot/1.0; +claudebot@anthropic.com)" ] "cf-connecting-ip" => array:1 [ 0 => "18.222.254.247" ] "accept" => array:1 [ 0 => "text/html,application/xhtml+xml,application/xml;q=0.9,image/avif,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3;q=0.7" ] "sec-fetch-site" => array:1 [ 0 => "none" ] "cf-visitor" => array:1 [ 0 => "{"scheme":"https"}" ] "sec-fetch-mode" => array:1 [ 0 => "navigate" ] "sec-fetch-user" => array:1 [ 0 => "?1" ] "x-forwarded-proto" => array:1 [ 0 => "https" ] "cf-ipcountry" => array:1 [ 0 => "US" ] "accept-encoding" => array:1 [ 0 => "gzip, br" ] "sec-fetch-dest" => array:1 [ 0 => "document" ] "sec-ch-ua-platform" => array:1 [ 0 => ""Windows"" ] "x-forwarded-for" => array:1 [ 0 => "18.222.254.247" ] "cf-ray" => array:1 [ 0 => "91623b51f9cc2243-ORD" ] "host" => array:1 [ 0 => "www.corspedia.com" ] "content-length" => array:1 [ 0 => "" ] "content-type" => array:1 [ 0 => "" ] ]
        request_server
        0 of 0
        array:50 [ "USER" => "www-data" "HOME" => "/var/www" "HTTP_SEC_CH_UA_MOBILE" => "?0" "HTTP_SEC_CH_UA" => ""HeadlessChrome";v="129", "Not=A?Brand";v="8", "Chromium";v="129"" "HTTP_CACHE_CONTROL" => "no-cache" "HTTP_PRAGMA" => "no-cache" "HTTP_CDN_LOOP" => "cloudflare; loops=1" "HTTP_PRIORITY" => "u=0, i" "HTTP_UPGRADE_INSECURE_REQUESTS" => "1" "HTTP_USER_AGENT" => "Mozilla/5.0 AppleWebKit/537.36 (KHTML, like Gecko; compatible; ClaudeBot/1.0; +claudebot@anthropic.com)" "HTTP_CF_CONNECTING_IP" => "18.222.254.247" "HTTP_ACCEPT" => "text/html,application/xhtml+xml,application/xml;q=0.9,image/avif,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3;q=0.7" "HTTP_SEC_FETCH_SITE" => "none" "HTTP_CF_VISITOR" => "{"scheme":"https"}" "HTTP_SEC_FETCH_MODE" => "navigate" "HTTP_SEC_FETCH_USER" => "?1" "HTTP_X_FORWARDED_PROTO" => "https" "HTTP_CF_IPCOUNTRY" => "US" "HTTP_ACCEPT_ENCODING" => "gzip, br" "HTTP_SEC_FETCH_DEST" => "document" "HTTP_SEC_CH_UA_PLATFORM" => ""Windows"" "HTTP_X_FORWARDED_FOR" => "18.222.254.247" "HTTP_CF_RAY" => "91623b51f9cc2243-ORD" "HTTP_HOST" => "www.corspedia.com" "REDIRECT_STATUS" => "200" "SERVER_NAME" => "corspedia.com" "SERVER_PORT" => "443" "SERVER_ADDR" => "141.95.147.152" "REMOTE_USER" => "" "REMOTE_PORT" => "20906" "REMOTE_ADDR" => "172.71.254.110" "SERVER_SOFTWARE" => "nginx/1.18.0" "GATEWAY_INTERFACE" => "CGI/1.1" "HTTPS" => "on" "REQUEST_SCHEME" => "https" "SERVER_PROTOCOL" => "HTTP/2.0" "DOCUMENT_ROOT" => "/var/www/corspedia/public" "DOCUMENT_URI" => "/index.php" "REQUEST_URI" => "/en/courses/web-tooling-&-automation" "SCRIPT_NAME" => "/index.php" "CONTENT_LENGTH" => "" "CONTENT_TYPE" => "" "REQUEST_METHOD" => "GET" "QUERY_STRING" => "" "SCRIPT_FILENAME" => "/var/www/corspedia/public/index.php" "PATH_INFO" => "" "FCGI_ROLE" => "RESPONDER" "PHP_SELF" => "/index.php" "REQUEST_TIME_FLOAT" => 1740261445.6989 "REQUEST_TIME" => 1740261445 ]
        request_cookies
        []
        
        response_headers
        0 of 0
        array:5 [ "content-type" => array:1 [ 0 => "text/html; charset=UTF-8" ] "cache-control" => array:1 [ 0 => "no-cache, private" ] "date" => array:1 [ 0 => "Sat, 22 Feb 2025 21:57:25 GMT" ] "set-cookie" => array:2 [ 0 => "XSRF-TOKEN=eyJpdiI6IlRwVjBzS3BDdDVmWHFuTXdDSWYzNVE9PSIsInZhbHVlIjoib0xVZGRNWEE2MUdoN0FaU3RkUm5nU3FjdnRRbjRHYzh1d1JOWW1COHJTS2Q2ODdkdVZSNTdTZmhZWlhlQlEwSXI4ay82ZDlwZUxLdWROMzR5aWRVWDhTcktPQVVEWHhhcTAxU0ZIM2hERkhoZlpxaEZjM2ZiUSttOEYyTG1wamsiLCJtYWMiOiJiZjhmMGZjYjc4OTk5NDhmZTIzMzJiYjNmNzU3NzQyY2ZmY2Y5YmU2OWZkMDliYmI3NDZkNmRiMGU2YjE1MGM1IiwidGFnIjoiIn0%3D; expires=Sat, 22 Feb 2025 23:57:25 GMT; Max-Age=7200; path=/; samesite=laxXSRF-TOKEN=eyJpdiI6IlRwVjBzS3BDdDVmWHFuTXdDSWYzNVE9PSIsInZhbHVlIjoib0xVZGRNWEE2MUdoN0FaU3RkUm5nU3FjdnRRbjRHYzh1d1JOWW1COHJTS2Q2ODdkdVZSNTdTZmhZWlhlQlEwSXI4ay82Z" 1 => "laravel_session=eyJpdiI6InFYSGRBcWNjcG9ncTZRZHFrQ2EzWHc9PSIsInZhbHVlIjoiZndMdUU5TUNyQnovQlNxbHc1K0tLMXhsS3hRaDhnUFl6Wk0zRi9LYTlaNUNpcWZPRTVPL2FTZUJ6aDQrb1k1Z1d0T01KL0RKVWhDVnhvQzU5Qk5qMEFVRmd5SlZFUmpxRnZjckpIa3hDRlp0dWJCekJIMWZYd0FtZUllZWhiRGwiLCJtYWMiOiIzOTUyOWU4YWI3NTMzODRmZGJlOTdiZjdiZDQxOGY4NWZiZmZiZDcxYmVjNGY0YmFjMmEwNjE2MjE0Zjc3NGQzIiwidGFnIjoiIn0%3D; expires=Sat, 22 Feb 2025 23:57:25 GMT; Max-Age=7200; path=/; httponly; samesite=laxlaravel_session=eyJpdiI6InFYSGRBcWNjcG9ncTZRZHFrQ2EzWHc9PSIsInZhbHVlIjoiZndMdUU5TUNyQnovQlNxbHc1K0tLMXhsS3hRaDhnUFl6Wk0zRi9LYTlaNUNpcWZPRTVPL2FTZUJ6aDQrb1k1Z1d0" ] "Set-Cookie" => array:2 [ 0 => "XSRF-TOKEN=eyJpdiI6IlRwVjBzS3BDdDVmWHFuTXdDSWYzNVE9PSIsInZhbHVlIjoib0xVZGRNWEE2MUdoN0FaU3RkUm5nU3FjdnRRbjRHYzh1d1JOWW1COHJTS2Q2ODdkdVZSNTdTZmhZWlhlQlEwSXI4ay82ZDlwZUxLdWROMzR5aWRVWDhTcktPQVVEWHhhcTAxU0ZIM2hERkhoZlpxaEZjM2ZiUSttOEYyTG1wamsiLCJtYWMiOiJiZjhmMGZjYjc4OTk5NDhmZTIzMzJiYjNmNzU3NzQyY2ZmY2Y5YmU2OWZkMDliYmI3NDZkNmRiMGU2YjE1MGM1IiwidGFnIjoiIn0%3D; expires=Sat, 22-Feb-2025 23:57:25 GMT; path=/XSRF-TOKEN=eyJpdiI6IlRwVjBzS3BDdDVmWHFuTXdDSWYzNVE9PSIsInZhbHVlIjoib0xVZGRNWEE2MUdoN0FaU3RkUm5nU3FjdnRRbjRHYzh1d1JOWW1COHJTS2Q2ODdkdVZSNTdTZmhZWlhlQlEwSXI4ay82Z" 1 => "laravel_session=eyJpdiI6InFYSGRBcWNjcG9ncTZRZHFrQ2EzWHc9PSIsInZhbHVlIjoiZndMdUU5TUNyQnovQlNxbHc1K0tLMXhsS3hRaDhnUFl6Wk0zRi9LYTlaNUNpcWZPRTVPL2FTZUJ6aDQrb1k1Z1d0T01KL0RKVWhDVnhvQzU5Qk5qMEFVRmd5SlZFUmpxRnZjckpIa3hDRlp0dWJCekJIMWZYd0FtZUllZWhiRGwiLCJtYWMiOiIzOTUyOWU4YWI3NTMzODRmZGJlOTdiZjdiZDQxOGY4NWZiZmZiZDcxYmVjNGY0YmFjMmEwNjE2MjE0Zjc3NGQzIiwidGFnIjoiIn0%3D; expires=Sat, 22-Feb-2025 23:57:25 GMT; path=/; httponlylaravel_session=eyJpdiI6InFYSGRBcWNjcG9ncTZRZHFrQ2EzWHc9PSIsInZhbHVlIjoiZndMdUU5TUNyQnovQlNxbHc1K0tLMXhsS3hRaDhnUFl6Wk0zRi9LYTlaNUNpcWZPRTVPL2FTZUJ6aDQrb1k1Z1d0" ] ]
        session_attributes
        0 of 0
        array:5 [ "_token" => "RG5RBWfMBL2ybT5XSQgpmDzVDRjEV83EZCHlawx0" "locale" => "en" "_previous" => array:1 [ "url" => "https://www.corspedia.com/en/courses/web-tooling-&-automation" ] "_flash" => array:2 [ "old" => [] "new" => [] ] "PHPDEBUGBAR_STACK_DATA" => [] ]