DOCSEARCHbyAlgolia
Submit Docs

FKS (Frontend Knowledge Structure)

repository·master·Indexed 12 days ago

https://github.com/jacksontian/fks

A comprehensive map and taxonomy of frontend development knowledge, covering domains such as browser engines, programming languages (JavaScript, TypeScript), markup, styling, development tools, code quality, frameworks, and performance practices.

Tokens
7.8K
Snippets
20
Records
35
Agent score
96%

What's inside FKS

  1. Overview of D3.js

    master
    D3.js (Data-Driven Documents) is a JavaScript library designed for manipulating documents based on data. It enables data visualization by leveraging web standards like HTML, SVG, and CSS. Instead of using a proprietary framework, D3 provides a data-driven approach to DOM manipulation, allowing you to use the full capabilities of modern browsers to create powerful visualization components.

  2. Overview of Frontend Knowledge Structure (FKS)

    master

    The Frontend Knowledge Structure (FKS) project is a collaborative, text-based repository designed to maintain and evolve a comprehensive graph of frontend development knowledge. Unlike static images, this repository allows contributors to update the knowledge structure using Git, ensuring the map of frontend technologies evolves alongside the industry.

    Key features:

    • Collaborative Development: Contributions are made via Git to track the history of the frontend profession.
    • Text-based Maintenance: The core knowledge structure is maintained in plain text for easy editing and version control.
    • Future Visualization: Plans include a tool based on DataV to generate dynamic and engaging visualizations from the text data.

  3. Frontend Knowledge Structure Overview

    master

    The Frontend Knowledge Structure (FKS) provides a comprehensive taxonomy of the skills, tools, and technologies required for frontend engineering. It categorizes knowledge into several key domains:

    • Browsers: Understanding rendering engines like Blink (Chrome/Opera), WebKit (Safari), Gecko (Firefox), and EdgeHTML/Trident (Edge/IE).
    • Programming Languages: Core proficiency in JavaScript, TypeScript, and Node.js.
    • Markup & Styling: HTML5, CSS/CSS3, and preprocessors like Sass, LESS, Stylus, and postCSS.
    • Development Tools: Editors (VS Code, WebStorm, Vim), Debugging tools (Chrome Dev Tools, Fiddler), and Version Control (Git, SVN).
    • Code Quality: Linting (ESLint, JSHint), Unit Testing (Mocha, Jasmine), and Automation (WebDriver, Karma).
    • Libraries & Frameworks: Modern frameworks like Vue and React, alongside legacy or specialized libraries like jQuery, AngularJS, and Backbone.
    • Standards & Specifications: HTTP/1.1, HTTP/2, ECMAScript, W3C DOM/BOM, and Web Accessibility (WCAG, WAI-ARIA).
    • Performance & SEO: Optimization tools (PageSpeed, YSlow) and performance best practices.
    • Deployment & Build Tools: Compilers (Babel), Bundlers (webpack, Browserify), and Task Runners (Grunt, Gulp).
    • Mobile Web: Responsive design, Zeptojs, Cordova, and React Native.
    • Computer Science Fundamentals: Data structures, Algorithms, Networking, and Operating Systems.

  4. Backend Engineering Knowledge Structure

    master

    The Backend Engineering knowledge structure covers the essential components for server-side development:

    • Programming Languages: Proficiency in languages such as C, C++, Java, PHP, Ruby, or Python.
    • Web Servers: Configuration and management of servers like Nginx, Apache, or Lighttpd.
    • Databases: Mastery of SQL (MySQL, PostgreSQL, Oracle, DB2) and NoSQL (MongoDB, CouchDB).
    • Data Caching: Implementing high-speed data access using Redis or Memcached.
    • File Caching/Proxying: Using tools like Varnish or Squid.
    • Operating Systems: Working knowledge of Unix, Linux, OS X, and Windows.
    • Computer Science Fundamentals: Deep understanding of Data Structures.

  5. Frontend Development Knowledge Structure

    master

    The Frontend Development knowledge structure is organized into several key domains required for a professional Frontend Engineer. These include:

    • Web Browsers: Understanding rendering engines like Trident (IE), Gecko (Firefox), Blink (Chrome/Opera), and WebKit (Safari).
    • Programming Languages: Mastery of JavaScript, Node.js, and TypeScript.
    • Slicing & Markup: Proficiency in HTML5, CSS3, and preprocessors like Sass, LESS, Stylus, or PostCSS, alongside design tools (e.g., Sketch, Photoshop).
    • Development Tools: Using IDEs (VS Code, WebStorm, Vim), debugging tools (Chrome Dev Tools, Fiddler), and Revision Control (Git, SVN).
    • Code Quality: Implementing coding styles (JSLint, ESLint), unit testing (Mocha, Jasmine), and auto-testing (WebDriver, Karma).
    • Libraries & Frameworks: Knowledge of ecosystems like jQuery, React, Angular, and Bootstrap.
    • Standards & Specifications: Understanding HTTP/1.1, HTTP/2, ECMAScript, W3C DOM/BOM, and Web Accessibility (WCAG, WAI-ARIA).
    • Performance: Utilizing tools like PageSpeed and JSPerf, and following performance best practices.
    • Deployment & Build: Managing the lifecycle via build tools (Grunt, Gulp, Yeoman), transpilers (Babel), and modularization (CommonJS, AMD, Browserify).
    • Security: Protecting against CSRF, XSS, and implementing CSP and Same-origin policy.
    • Mobile Web: Implementing Responsive Web Design and using frameworks like React Native or Zeptojs.
    • Computer Science & Soft Skills: Fundamentals in Data Structures, Algorithms, OS, Networking, and professional skills like Communication and Requirements Management.

  8. Install and setup angular-marked

    master

    To use angular-marked in your AngularJS application, follow these steps:

    1. Install the package via Bower:
      bower install angular-marked
    2. Include the marked.js script in your application (default path: bower_components/marked/lib/marked.js).
    3. Include the angular-marked.js script in your application (default path: bower_components/angular-marked/angular-marked.js).
    4. Add hc.marked as a module dependency to your AngularJS app.
    bower install angular-marked

  9. Recommended Backend Books

    master

    A curated list of books for backend development, covering Linux administration, programming, and C/C++.

    Linux Management

    Linux Programming

    C/C++

  11. Book recommendations for Backend developers

    master

    A curated list of books for backend engineers covering Linux administration, programming, and C/C++.

    Linux administration

    Linux programming

    C/C++