2020-Todo / Progress Notes

This is my todo file for what I'll do in 2020. I'm an 18 years old portuguese guy with passions for tech, volleyball and entrepreneurship. In here, I list what I wish to do. Also, when I say "master" I mean know enought that I can do anything I wish to do with it pretty efficiently, not that I completely memorized every detail / use case;

Here it is:

Todo

Main

Vim Keybindings

• Learn what Vim is;
• Learn Vim Keybindings;
• Learm Vim in VS Code;

Fully master React.js

• Learn about props and state;
• Learning about components and class-based lifecycles methods;
• Mastering class based lifecycle methods (ended up not doing, I'm basically only using arrow function components, with hooks);
• Learn React development best practises;
• useState and useState (and custom hooks);
• useRef and useCallback;
• useReducer
• Context, createContext, useContext;
• Memoization and useMemo;
• React optimization;
• Check rest of React to see what's left to master;

Experiment more with Redux and React

• Learn abbout why use Redux;
• Become able to developm quickly and efficiently with redux and react;
• Learn about Redux use best practises;
• Learn about "global" state (still learning);
• Optimization techniques with Redux;
• Fully master Redux;

Master Node.js and Express.js

• Learn what they are and when to use them;
• Learn syntax, check documentation;
• Learn about routing;
• Learn middleware;
• Master all syntax;
• Learn data handling with Axios;
• Learn about db integration;
• Learn about integrating with MongoDB;
• Learn about integrating with MySQL;
• Master database integration with other databases;

Learn Next.js

• Learn and test the different Next.js concepts using documentation / tutorials;
• For being able to do server-side rendering;
• Learn about deployment;

Learn Firebase

• Learn about fb integration with web apps;
• Learn about fb databases;
• Learn about fb cloud;
• Learn about rapid deployment with firebase;
• Build and deploy full stack web app React and Firebase (optional) -> Canceled;

Learn MongoDB

• Install MongoDB;
• Use MongoDB CLI;
• Use MongoDB Atlas;
• Connect to MongoDB atlas database from a web app;
• Memorize and learn the syntax for using with JavaScript;
• Know what mongoose is and why use it;
• Learn why / how to use mongoose;
• Master MongoDB;

Learn about simple full-stack deployment

Build and deploty a full stack web app with React, Express, and MongoDB

Master DevOps

• Learn simple Bash;
• Learn about Git;
• Learn git config;
• Learn git intit, add, commit;
• Learn git push, sync, pull;
• Learn git branching;
• Learn git merging;
• Master git;
• Learn Azure DevOps;

Master SQL (MySQL)

• Fully understand RDBMS;
• Thoroughly understand SQL;
• Fully master data CRUD with MySQL;
• Learn about db deployment and db integration with client;

Make full stack production application with MERN (MongoDB or MySQL)

Learn basic to medium concepts about data structures and algorithms

• Using Udemy free course/freecodecamp youtube video;

Learn about data scraping

• Learn about the concept of data scraping;
• Learn about different data scraping libraries / tools;
• Learn about web data scraping with NodeJS;
• Learn about data scraping with Puppeteer;
• Make a full stack data scraping project, with NodeJS, Express, React and MongoDB / mySQL;

Master C#, .NET, ASP.NET and become better at server-client interaction

• Learn OOP principles;
• Learn the syntax;
• Learn the principal libraries and how the .NET environment works;
• Lean ASP.NET CORE;
• Learn MVC;
• Learn IoC;
• Learn Web API with ASP.NET;
• Learn about hangfire;

Learn NGINX

• Learn NGINX for accessing in-server data and manage it;
• Learn NGINX Ingress Controllers;

Learn Docker

• Learn about containerization;
• Learn Docker containers;
• Learn Docker commands;
• Learn Docker production deployment;
• Learn about Docker with Azure;

Learn Kubernetes

• Learn about Docker and Kubernetes;
• Learn about pods, images, nodes, etc.;
• Learn YAML really well;
• Learn about deployment;
• Use on DigitalOcean;
• Use on Azure, with Kubernetes Azure Service;

Learn Linux

• Learn about basic installation (probably using a usb drive);
• Boot and install;
• Learn basic Linux;
• Use Ubuntu;
• Learn intermediate Linux / Unix;
• Use and customize Kubuntu;

Build and deploy a full scalable web app with kubernetes, ASP.NET and/or Node.js, MySQL / MongoDB database and a React front-end

• A good one;

Build a really nice workstation

• https://nickcraver.com/desktop-build/, one day, I will have something like this, IF I HAVE THE MONEY and knowledge I guess;
• Using part builder;

Side wishes -> not the focus

• Integrate tensorflow into an augmented application using Unity3D;
• React testing / other React hooks;
• Research "safer" investing strategies (dividend yield, dividend growth, others)
• Start generating side-money, aside from current job;
• Plant and harvest tomatoes and spinach (have been into planting and stuff for some reason);
• Eat more and bulk up;
• Get a whiteboard;
• Kali Linux and Ethical Hacking (George Hotz is cool);
• Get a medium quality filming camera/webcam - got my eyes on this(https://www.amazon.es/dp/B01L6L52K4?ref=emc_p_m_9_b&th=1) - + microphone (still checking);
• Learn and use video editing software - Davinci Resolve Probably ;
• Get a raspberry pi / arduino and do the equivalent of an "Hello World" with it;
• Learn more about AI and ML;

Stuff I'm pretty good at

• HTML5;
• CSS3;
• Modern Javascipt;
• Sass;
• Adobe XD;
• Azure Fundamentals;
• Microsoft Bot Framework;
• Natural language processing (Microsoft's LUIS and Google's Dialogflow);
• Bash;
• React;
• NPM;
• Webpack;
• Git, Github;

NOTES

• See folder Notes for all the notes I made about what I learned / am learning.

What I use when developing currently

• Kubuntu + Windows 10 dual boot Laptop
• PyCharm for pyhton developing;
• Visual Studio Code for basically any other language that I currently use;
• Sometimes Visual Studio for C# developing (I use VS Code usually even for C#);
• For Visual Studio Code Extensions, I use:
  • Auto Rename Tag;
  • C#;
  • Docker;
  • ES7 React/Redux/React-Native/JS snippets;
  • GitLens
  • Git supercharged;
  • Live Sass Compiler;
  • Live Server;
  • Material Icon Theme;
  • Material Theme;
  • Palenight High Contrast;
  • NuGet Package Manager;
  • Prettier;
  • Python;
  • SQL Server (mssql);
  • Visual Studio IntelliCode;
  • AREPL for Python;

See my development diagram, contains details of what I aim to learn

• https://coggle.it/diagram/XlUjP9ceSi-PCdqG/t/development-roadmap-2020/ac6d4f185ce018582e35d6e8cb1c4ff65aa441adc2f960746b9e13e44a8e5fd2

Web Development Roadmap

• I'll follow the route described in the roadmap to upgrade myself;
• There will be notes in the folders for every section;

How to follow this

• To follow this in a better way, you should follow this in alphabeticall order;
• Option 1: Clone the repo;
• Option 2: Use a userscript -> https://github.com/Mottie/GitHub-userscripts/wiki/GitHub-sort-content -> to sort the files by alphabetical order ;
• Sort the files;
• Go through the files as described below + numerical order -> 1. , 2. , 3. , ... ;

Here you will learn about

The General Knowledge Route

• Version Control;
• Basic Command Line;
• Web;
• Good Practises;
• Research;
• Code Editor;
• Data Structures and Algorithms;

The Frontend Route

• Basic Understanding:

• Domain Name;

• How does the internet work;

• HTTP;

• Browsers;

• DNS;

• Hosting;

• The Basic Web Components:

• HTML:

  • Basic Syntax;
  • Forms and validation;
  • Learn to write semantic HTML;
  • Conventions and best practises;
  • Accessibility;
  • SEO Basics;

• CSS:

  • Basic Syntax:
  • Layouts:
  • Flexbox;
  • CSS Grid;
  • Contents & Components:
  • Position;
  • Navigation and mobile navigation;
  • Box Model;
  • Display;
  • Floats;
  • Media queries and responsive;
  • Images, SVG and video;
  • Responsive images;
  • CSS animations;

• JavaScript:

  • Syntax and basic construct;
  • Basic programming;
  • Querying, selecting and working with the DOM;
  • XHR (AJAX) w/ Fetch;
  • Modern ES6+;
  • Hoisting;
  • First-Class Functions;
  • Closures;
  • Scope;
  • Context;
  • Modular JS;
  • Event bubbling;
  • Prototype;
  • Shadow DOM;
  • strict;

• Front End Enginner:

• Hosting:

  • Digital Ocean;
  • Zeit NOW;
  • Netlify;
  • AWS;

• Package Manager:

  • NPM;

• Web Security:

  • HTTPS;
  • CORS;
  • Content Security Policy;
  • OWASP Security Risks;

• Better CSS:

  • CSS Preprocessor:
  • SASS / SCSS;
  • CSS Organization:
  • BEM;
  • CSS Framework:
  • Bootstrap;
  • Others;

• Javascript Framework - React:

• Linter:

  • Prettier;
  • ES Lint;

• Basic to medium concepts:

  • JSX;
  • Render;
  • Components;
  • Props;
  • State;
  • Events;
  • Conditionals;

• Advanced Concepts:

  • Hooks;
  • Fragments;
  • Async act;
  • Concurrent Mode;
  • Portals;
  • Suspense;

• Frameworks & Tools:

  • Sockets;
  • Create React App (CRA);
  • NextJS;
  • Apollo and GraphQL;
  • Reactsrapp;
  • CSS Emotion / Styled Components;
  • Gatsby.js;
  • Puppeteer (Data Scraping);
  • Axios;

• State Management:

  • Redux;
  • MobX (opt.);

• Module Loader / Bundler:

  • Babel;
  • Webpack;

• Task Runners:

  • npm scripts;
  • gulp (opt.);

• Type checking:

  • Typescript;

• Testing:

  • Unit testing, inegration testing and functional testing;
  • Run you tests:
  • Mocha;
  • react-testing-library;
  • Jest;
  • Cypress;
  • Enzyme;

• Going deeper:

  • Desktop Apps:
  • Electron;
  • Progressive Web Apps (PWAs):
  • Web APIs:
    • Storage;
    • Web Sockets;
    • Service Workers;
    • Location;
    • Notifications;
    • Device Orientation;
    • Payment;
    • Credentials;
  • Performance:
    • PRPL Pattern;
    • RAIL Model;
    • Performance Metrics;
    • Using Lighthouse;
    • Using DevTools;
  • Web Assembly (WASM):
  • Rust;
  • Others...;

The Backend Route

• OSs and General Knowledge:

  • Terminal Usage;
  • How OSs work in general;
  • Process Management;
  • Threads and concurrency;
  • Memory Management;
  • I/O Management;
  • POSIX Basics;
  • Basic Networking Concepts;
  • Learn a language:

• Functional Language:

  • C# / .NET:
  • Learn the language;
  • Frameworks and tools:
    • .NET Core;
    • .NET Framework;
    • ASP.NET;
    • Entity Framework;
    • LINQ;
    • Others;
  • Java (opt.):
  • Learn the language;

• Scripting Language:

  • NodeJS:
  • Learn the language;
  • Frameworks and tools:
    • ExpressJS;
    • Mocha;
    • Others;
  • Python:
  • Learn the language;
  • Frameworks and Tools:
    • Django;
    • Flask;
    • Others;

• High-Performance Language:

  • Go (Golang);
  • Learn the language;
  • C / C++;
  • Learn the language;

• Databases:

• Database Concepts:

  • ORMs;
  • ACID;
  • Transactions;
  • N + 1 Problem;
  • Database Normalization;
  • Indexes;
  • Data Replication;
  • Sharding Strategies;
  • Cap Theorem;

• Relational Databases:

  • MySQL;
  • PostgreSQL;

• Non-Relational / No-SQL Databases:

  • MongoDB;

• Graph Databases:

  • ArangoDB;

• APIs:

  • Concepts:
    • REST;
    • JSON APIs;
    • SOAP;
    • HATEOAS;
    • Open API Spec and Swagger;
  • Authentication:
    • Cookie Based;
    • OAuth;
    • Basic Authentication;
    • Token Authentication;
    • JWT;
    • OpenId;

The DevOps Route

• Main Concepts:
  • OS Concepts:
    • Startup Management (initd);
    • Process Management;
    • Threads and concurrency;
    • Sockets;
    • POSIX;
    • Networking;
    • I/O Managent;
    • Virtualization;
    • Memory / Storage;
    • File Systems;
    • Service Management (systemd);
  • Operating Systems:
    • Linux;
    • Unix;
    • Linux Distros;
  • Terminal:
    • screen;
    • tmux;
    • terminal multiplexers;
    • Bash scripting;
    • Vim;
    • Compiling apps from source;
    • System performance;
    • Text manipulation;
    • Process monitoring;
    • Networking;
  • Networking, security and protocols:
    • Email:
    • SMTP;
    • Others;
    • HTTP & HTTPS;
    • FTP;
    • SSL & TLS;
    • SSH;
    • Port forwarding;
• Learn to setup:
  • Reverse Proxy;
  • Forward Proxy;
  • Caching Server;
  • Load Balancer;
  • Firewall;
• Web Server:
  • NGINX;
  • Apache;
• Containers:
  • Docker;
• Container Orchestration:
  • Kubernetes;
  • Helm;
• CI & CD:
  • Jenkins;
  • CircleCI;
  • Gitlab & Github actions; -TeamCity;
• Intermediate Concepts:
• Configuration Management:
  • Ansible;
• Infrastructure Provisioning:
  • Terraform;
• Monitoring:
  • Infrastructure Monitoring:
  • Prometheus;
  • Nagions;
  • Grafana;
  • Application Monitoring:
  • App Dynamics;
  • New Relic;
  • Logs Management:
  • Elastic Stack (ELK Stack);
• The Cloud:
  • Cloud Providers:
    • Digital Ocean;
    • AWS;
  • Cloud Design Patterns:
    • Availability;
    • Data Management;
    • Design and implementation;
    • Management and Monitoring;
  • File Servers;
    • Cloudinary;
    • AWS;