flowchart LR

classDef labels fill:#88f,stroke:#222,stroke-width:4px,color:#fff;
classDef ultraProfitable fill:#f66,stroke:#222,stroke-width:4px,color:#fff;
classDef highProfitable fill:#f96,stroke:#222,stroke-width:3px,color:#222;
classDef profitable fill:#fc6,stroke:#222,stroke-width:2px,color:#222;

lblIni([INÍCIO]):::labels
lblIni --> lblDsn([DESIGN]):::labels
lblIni --> basics("OdinProject: Foundations Course (44 lessons, 5 projects)")
basics --> lblFE([FRONTEND]):::labels
lblIni --> lblBE([BACKEND]):::labels
lblIni --> lblDO([DEVOPS]):::labels
lblIni --> lblDB([DATABASE]):::labels
lblIni --> lblFL([FREELANCE]):::labels

%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
%% Design
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%

subgraph Design
  lblDsn --> canvas("Canvas<hr><a href='https://www.udemy.com/course/canva-master-course-graphic-design-for-beginners/'>Udemy: Canva Master Course | Learn Canva with Ronny (16.5h) </a>")
  lblDsn --> photoshop("Photoshop<hr>Udemy: Adobe Photoshop CC – Essentials Training Course (11 hours)
    Udemy: Adobe Photoshop CC – Advanced Training Course (16.5 hours)
  "):::profitable
  lblDsn ---> illustrator("Illustrator<hr>Udemy: Adobe Illustrator CC - Essentials Training Course Illustrator (9.5 hours)
    Udemy: Adobe Illustrator CC – Advanced Training Course (9.5 hours)
  "):::profitable
  lblDsn ----> indesign("InDesign<hr>Udemy: Adobe InDesign CC - Essentials Training Course (7.5 hours)
    Udemy: Adobe InDesign CC - Advanced Training Course (8.5 hours)
  ")
  illustrator -.- indesign
  illustrator --> logo("Logo Design<hr>Udemy: Logo Design in Adobe Illustrator - for Beginners & Beyond (17 hours)
    <a href='https://www.udemy.com/course/logodesignintermediate/'>Logo Design in Adobe Illustrator - The Intermediate Level (hours)</a>
  ")
  illustrator --> ilv(Ilustração Vetorial)
  ilv ---> lblIls([ILUSTRADOR])
  photoshop --> il(Ilustração Digital)
    il --> lblIls
  photoshop ---> pd(Pintura Digital)
    pd --> lblIls
  photoshop ----> rtq(Retoque Fotográfico)
    rtq --> cmp(Composição Fotográfica)
  lblDsn --> Premiere
  lblDsn ---> AfterEffects
  Premiere -.- AfterEffects
  photoshop --> lblDg([DESGIN GRÁFICO])
  illustrator --> lblDg
  indesign --> lblDg
end

%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
%% Front-End
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%

subgraph FrontEnd
  lblFE --> html("HTML<hr><strong>CodeCademy: Learn HTML 🆗✔️</strong>"):::ultraProfitable
    %% https://www.codecademy.com/learn/learn-html
  html --> uiux("UI/UX<hr><strong>CodeCAdemy: Introduction to UI and UX Design</strong>
    Coursera: Certificado Profissional Design de UX no Google
    <a href='https://www.udemy.com/course/freelance-web-design-from-design-to-development-to-making-money/'>Udemy: Complete Web Design: from Figma to Webflow to Freelancing (19.5h)</a>
    ")
  uiux --> css("CSS<hr><strong>CodeCademy: Learn CSS 🆗✔️</strong>
    CodeCademy: Build a Website with HTML, CSS, and GitHub Pages (Skill Path) 🆗
    CodeCademy: How to Make a Website with NameCheap (5 lessons) 🆗
    CodeCademy: Learn CSS: Introduction (3 lessons) 🚀
    CodeCademy: Learn CSS: Box Model and Layout (display, positioning) (3 lessons) 🚀
    CodeCademy: Learn Navigation Design 🆗
    CodeCademy: Learn CSS: Colors (1 lesson)🆗
    CodeCademy: Learn Intermediate CSS (10 lessons) 🆗
    OdinProject: Intermediate HTML and CSS Course (21 lessons, 2 projects)
    OdinProject: Advanced HTML and CSS Course (15 lessons, 1 project)
    CodeCademy: Learn CSS: Flexbox and Grid (3 lessons) 🚀
    CodeCademy: Learn CSS: Transitions and Animations (1 lessons)🆗
    CodeCademy: Learn CSS: Responsive Design (media queries) (2 lessons) 🆗 🚀
    CodeCademy: How to Deploy a Website
    CodeCademy: Learn CSS: Accessibility (1 lesson)🆗
    CodeCademy: Learn Color Design ✔️
    CodeCademy: Learn CSS: Variables and Functions (2 lessons)
    CodeCademy: Learn CSS: Browser Compatibility (1 lesson)
    CodeCademy: Learn CSS: Typography and Fonts (1 lesson)🆗
    <hr>Avada (@theme-fusion) (85 projects)
    Canvas Niche Demos (@theme-forest) (57 projects)
    Metronic HTML Demos (@theme-forest) (40 projects)
    "):::ultraProfitable
    %% CSS Media Queries?
    %% CSS Floats?
  css --> sass("SASS<hr>CodeCademy: Learn SASS (4 lessons)
    "):::profitable
  css --> cssjs
  css --> tailwind
  sass --> bootstrap
    
  subgraph CSSF %% CSS Frameworks
    tailwind("Tailwind")
    bootstrap("Bootstrap<hr>CodeCademy: Learn Bootstrap (4) (1 lessons)
    "):::profitable
  end

  html --> bjs("Basic JavaScript: conditionals, loops, array, objects, functions, methods<hr>CodeCademy: Learn JavaScript (11 lessons) 🆗
    CodeCademy: Building Interactive JavaScript Websites (5 lessons) 🆗
    CodeCademy: Learn JavaScript: Objects (2 lessons)
    freeCodeCamp: JavaScript Algorithms and Data Structure (113 exercises)
    exercism: JavaScript (139 exercises)
    "):::ultraProfitable
  bjs --> jq("jQuery<hr>CodeCademy: Learn jQuery (5 lessons)"):::profitable
  bjs --> ijs("Intermediate JavaScript: design patterns, modules, asynchronous JS, ES6<hr>CodeCademy: Learn Intermediate JavaScript (6 lessons) 🆗"):::ultraProfitable
  ijs --> jstest("JavaScript Testing<hr>CodeCademy: Learn JavaScript Unit Testing (mocha) (4 lessons) 🆗
    CodeCademy: Learn JavaScript: Asynchronous Programming (2 lessons) 🆗
    Jest.io: Getting Started
    Cypress: Getting started/Installing Cypress
    Vitest: Guide
    "):::profitable
  bjs --> bootstrap
  ijs --> react
  ijs --> ts("TypeScript<hr>CodeCademy: Learn TypeScript (6 lessons)
    "):::highProfitable
  ts --> angular
  ijs --> vue
  
  subgraph JSF %% JavaScript Frameworks
    react("React<hr>CodeCademy: Learn React (7 lessons) 🆗
      CodeCademy: Learn Advanced React (7 lessons) 🆗
      CodeCademy: Learn React Testing (2 lessons)
      CodeCademy: Create a front-end app with React (9 lessons)🆗
      CodeCademy: Learn Redux (5 lessons) 🆗
      CodeCademy: Create an Advanced Web App with React and Redux (6 lessons)🆗
      CodeCademy: Learn React Router (1 lesson)
      OdinProject: JavaScript Course (35 lessons, 16 projects)
    "):::ultraProfitable
    angular("Angular (framework<hr>"):::ultraProfitable
    vue:::highProfitable
  end
  react --> rnat("React Native"):::profitable
  react --> RCL
  react --> cssjs("CSS in JS (CSS in React)<hr><a href='https://www.codecademy.com/learn/learn-css-in-js'>CodeCademy: Learn CSS-in-JS (3 lessons)</a>
    <a href='https://www.udemy.com/course/styled-components-tutorial-and-project-course/'>Udemy: React Styled Components Course (V5) (3h)</a> 💸
    <a href='https://www.udemy.com/course/react-styled-components/'>Udemy: React styled components / styled-components [V5 EDITION] (2h)</a> 💸
  ")
  subgraph RCL %% "React Component Libraries"
    direction TB
    materialui("Material UI<hr><a href='https://www.udemy.com/course/implement-high-fidelity-designs-with-material-ui-and-reactjs/'>Udemy: Implement High Fidelity Designs with Material-UI and ReactJS (42h)</a> 💸")
    ant-design("Ant Design<hr><a href='https://www.udemy.com/course/react-redux-ecommerce/'>React Redux Ecommerce - Master MERN Stack Web Development (43h)</a> 💸")
    storybook("Storybook")
  end
end

subgraph GameDev
  jsgame("Game Development<hr>CodeCademy: Learn Game Development with Phaser.js (6 lessons)
    CodeCademy: Create Video Games with Phaser.js (18 lessons)
    ")
end

%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
%% Back-End
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%

subgraph BackEnd
  lblBE --> node
  ijs --> node("Node.js<hr>CodeCademy: Learn Node.js (4 lessons) 🆗
    CodeCademy: Introduction to Back-End Programming (1 lesson) 🆗
    CodeCademy: Learn Express.js (6 lessons) 🆗
    CodeCademy: Create a Back-End App with JavaScript (29 lessons) 🆗
    OdinProject: NodeJS Course (17 lessons, 7 projects)
    CodeCademy: User Authentication & Authorization in Express (6 lessons) 🆗
    CodeCademy: Learn Testing for Web Development (TDD) (4 lessons) 🆗
    CodeCademy: API Development with Swagger and OpenAPI (5 lessons) 🆗
    CodeCademy: Connecting Front-End to Back-End (4 lessons) 🆗
    CodeCademy: Securing Express Applications (5 lessons) 🆗
    CodeCademy: Defending Node Applications from SQL Injection, XSS, & CSRF Attacks (4 lessons) 🆗
    CodeCademy: Pass the Technical Interview with JavaScript (36 lessons)
  "):::ultraProfitable
  node --> webs("Web Sockets<hr>CodeCademy: Learn Web Sockets (2 lesson)
    ")
  webs --> jsgame
  node --> nodedb("Database for Node<hr>Learn MongoDB (8 lessons)
    CodeCademy: Learn SQL (4 lessons)
    CodeCademy: Learn Node-SQLite (needs SQL!) (1 lesson)
  "):::profitable
  lblBE --> py("Python 3<hr>CodeCademy: Learn Python 3 (14 lessons)
    CodeCademy: Build Connect Four Using Python (1 lesson)
    CodeCademy: Learn Intermediate Python 3 (11 lessons)
    CodeCademy: Learn Intermediate Python 3: Functions, Namespaces, and Scope (3 lessons)
    CodeCademy: Learn Intermediate Python 3: Object-Oriented Programming (1 lesson)
    CodeCademy: Learn Intermediate Python 3: Exceptions and Unit Testing (2 lessons)
    CodeCademy: Learn Intermediate Python 3: Iterators and Generators (2 lessons)
    CodeCademy: Learn Intermediate Python 3: Sets and Specialized Collections (2 lessons)
    CodeCademy: Learn Intermediate Python 3: Resource Management (1 lesson)
    CodeCademy: Learn Advanced Python 3 (5 lessons)
    CodeCademy: Learn Advanced Python 3: Logging (1 lesson)
    CodeCademy: Learn Advanced Python 3: Functional Programming (1 lesson)
    CodeCademy: Learn Advanced Python 3: Database Operations (1 lesson)
    CodeCademy: Learn Advanced Python 3: Concurrency (2 lessons)
    CodeCademy: Learn Python 2 (20 lessons)
    CodeCademy: Python for Programmers (python 2?) (6 lessons)
    CodeCademy: Pass the Technical Interview with Python (43 lessons)
  "):::highProfitable
  py --> pybe("Python for BackEnd<hr>Learn Flask (using Heroku) (5 lessons)
    CodeCademy: Build Python Web Apps with Flask (20 lessons)
    CodeCademy: Build Python Web Apps with Django (8 lessons)
  "):::profitable
  py --> pycs("Computer Science<hr>CodeCademy: CS101 Variables and Basic Syntax (18 lessons) (basic python)
    CodeCademy: Learn Data Structures and Algorithms with Python (37 lessons) 🆗
    CodeCademy: How to Implement Search Algorithms with Python (4 lessons) 🆗
    CodeCademy: Learn Sorting Algorithms with Python (5 lessons)
    CodeCademy: Linear Data Structures (4 lessons) 🆗
    CodeCademy: Learn Complex Data Structures (4 lessons) 🆗
    CodeCademy: Learn Advanced Algorithms and Data Structures with Python (7 lessons)🆗
    CodeCademy: Learn Advanced Data Structures with Python: Deques (1 lesson)
    CodeCademy: Learn Advanced Data Structures with Python: Trees (2 lessons)
    CodeCademy: Learn Advanced Algorithms with Python: String Searching Algorithms (2 lessons)
    CodeCademy: Learn Advanced Algorithms with Python: Hamiltonian Algorithms (1 lesson)
    CodeCademy: How to Implement Search Algorithms with Python (4 lessons)
    CodeCademy: Learn Recursion with Python (1 lesson)
  ")
  lblBE --> java("Java<hr>CodeCademy: Learn Java (16 lessons) ✔️
    CodeCademy: Learn Java: Introduction ✔️
    CodeCademy: Java: Object-Oriented Programming ✔️
    CodeCademy: Java for Programmers ✔️
    CodeCademy: Java: Algorithms (8 lessons) ✔️
    CodeCademy: Java: Classes and Methods ✔️
    CodeCademy: Learn Java: Loops and Arrays ✔️
    CodeCademy: Learn Java: Inheritance and Polymorphism ✔️
    CodeCademy: Learn Java: Conditionals and Operators ✔️
    CodeCademy: Study for the AP Computer Science A Exam (Java) (23 lessons) ✔️
    CodeCademy: Learn Intermediate Java (8 lessons)
    CodeCademy: Learn Advanced Java (3 lessons)
    CodeCademy: Pass the Technical Interview with Java (36 lessons)
    CodeCademy: Technical INterview Practice with Java (2 lessons)
  "):::ultraProfitable
  java --> javamobi("Java para Android<hr>CodeCademy: Learn the Basics of Android (3 lessons)
    CodeCademy: Build Basic Android Apps with Java (13 lessons)
  "):::highProfitable
  java --> javabe("Java para BackEnd<hr>CodeCademy: Learn Spring (4 lessons)
    CodeCademy: Create REST APIs with Srping and Java (20 lessons)"):::profitable
  javabe --> microservices:::highProfitable
  pybe --> microservices
  microservices --> RabbitMQ:::profitable
  microservices --> ApacheKafka:::profitable

  node --> rest("REST APIs"):::highProfitable
  javabe --> rest
  pybe --> rest
  node --> firebase:::profitable
  javabe --> firebase
  pybe --> firebase

  lblBE --> ruby("Ruby on Rails<hr>CodeCademy: Learn Ruby (19 lessons)
    CodeCademy: Learn Ruby on Rails (4 lessons)
    OdinProject: Ruby on Rails Course (28 lessons, 11 projects)
    CodeCademy: Learn Authentication with Ruby on Rails (2 lessons)
    OdinProject: Ruby (26 lessons, 14 projects)
  "):::profitable

  node --> dp("Design Principles (include Clean Code, GoF Design Patterns)<hr>Software Design Principles (SOLID)(3 lessons)🆗"):::ultraProfitable
  py --> dp
  java --> dp
  ruby --> dp
  dp --> Agile:::ultraProfitable
  Agile --> jobPreparation("Job Preparation<hr>OdinProject: Getting Hired Course (11 lessons, 2 projects)")
  dp --> selenium("Selenium Testing"):::profitable
  selenium --> arch("Architecture Patterns")
end

%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
%%  Freelance
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%

subgraph Freelance
  lblFL --> wp
  wp --> php("PHP<hr>CodeCademy: Learn PHP (17 lessons)
    CodeCademy: Learn PHP: Introduction (3 lessons)
    CodeCademy: Learn PHP: Form Handling and Validation (5 lessons)
    CodeCademy: Learn PHP: Arrays and Loops (3 lessons)
    CodeCademy: Learn PHP: Conditionals and Logic (2 lessons)
    CodeCademy: Learn PHP: Objects and Classes (1 lesson)
    CodeCademy: Learn Intermediate PHP (2 lessons)
    CodeCademy: Learn PHP: Functions (2 lessons)
  "):::ultraProfitable
  wp --> ga("Google Analytics"):::profitable
  wp --> gad("Google Ads"):::profitable
  php --> wpa("WordPress Avançado"):::highProfitable
  react --> wpa
  php --> laravel("Larvel<hr><a href='https://www.udemy.com/course/laravel-vuejs-restful-api-course/'>Udemy: Laravel 8 Vuejs & RESTful API Course With Complete Project</a>
  "):::profitable
end

%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
%% Database
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%

subgraph PostgreSQL
  lblDB --> psql("PostgreeSQL<hr>CodeCademy: Learn SQL 🆗 (4 lessons)
    OdinProject: Databases Course (2 lessons, 1 project)
    CodeCademy: Design Databases with PostgreSQL (11 lessons)🆗
    CodeCademy: How to Transform Tables with SQL (4 lessons)
    CodeCademy: Analyze data with SQL (8 lessons)
  "):::ultraProfitable
  psql --> wpa
end

%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
%% Infrastructure
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%

subgraph InfraStructure
  lblDO --> devops("CI/CD<hr>CodeCademy: Introduction to DevOps ✔️
  ")
  devops --> terminal("Bash<hr>Vim Adventure (22 fev)
    YouTube: VomikoD VIM Adventures
  "):::profitable
  lblDO --> os("Fundamentals of Operating System")
  terminal --> linux("Linux System Admin")
  os --> linux
  linux --> cloud
    cloud --> cloud1("Amazon Web Services (AWS)"):::profitable
    cloud --> cloud2("Google Cloud Platform")
    cloud --> cloud3("Microsoft Azure"):::profitable
    cloud --> Serverless(Serverless: AWS Lambda):::profitable
  cloud1 --> cloudb
  cloud2 --> cloudb
  cloud3 --> cloudb
  Serverless --> cloudb
  cloudb --> scale("Scalability/Building for Scale"):::profitable
  cloudb --> microservices
  cloudb --> services
  services --> NGINX("NGINX<hr><a href='https://www.udemy.com/course/nginx-fundamentals/'>Udemy: NGINX Fundamentals: High Performance Servers from Scratch</a>
    <a href='https://www.udemy.com/course/ssl-complete-guide/'>Udemy: The Complete SSL and TLS Guide: HTTP to HTTPS</a>
    <a href='https://www.udemy.com/course/apache-web/'>Udemy: Apache Web Server</a>
    ")
  services --> ElasticSearch("Elasticsearch<hr><a href='https://www.udemy.com/course/elasticsearch-complete-guide/'>Udemy: Complete Guide to Elasticsearch</a>"):::profitable
  services --> Redis:::profitable
  scale --> dp %% design patterns
  
  lblDO --> git("Git<hr>CodeCademy: Learn Git & GitHub (5 lessons)
  gitmoji (flashcards)
  ")
  git --> dpl("Host<hr>CodeCademy: How to Deploy a Website [GitHub Pages] (3 lessons)
    CodeCademy: Deploying Websites using Git and GitHub (1 lesson)
    CodeCademy: Deploying with Netlify and Heroku (2 lessons)
  ")
  dpl --> ws("Web Security<hr>CodeCademy: Fundamentals of Cybersecurity (4 lessons)
    CodeCademy: Introduction to Cybersecurity (2 lessons) ✔️
    CodeCademy: Cybersecurity for Business ✔️
    CodeCademy: Fundamentals of Cyber Resilience and Risk Management (1 lesson)
    CodeCademy: Cybersecurity Analyst Interview Prep (4 lessons)
  "):::highProfitable
  dpl ---> iac("CI/CD: Infrastructure as Code")
    iac --> iac1("Service Mesh: Istio and Envoy, Linkerd")
    iac --> iac2("Containers: Docker"):::ultraProfitable
    iac --> iac3("Configuration Management: Ansible"):::profitable
    iac --> iac4("Container Orchestration: Kubernetes"):::highProfitable
    iac --> iac5("Infrastructure Provisioning: Terraform"):::profitable
    iac --> iac6("CI/CD: Jenkins")
  iac2 --> wpa %% WordPress Avançado
end

%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
%% Mobile
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%

subgraph Mobile
  swift("Swift<hr>CodeCademy: Build iOS Apps with SwiftUI"):::profitable

end