[PYTHON] Roadmap and reference materials for web development self-study

WEB development

Write a curriculum for the first start for your friends. While looking at this, I make a study policy, search by myself based on it, and study using various study sites. You don't have to try everything. Will be updated from time to time. The environment is assumed to be windows.

Introduction

Programming is easy to frustrate. Don't try to understand everything, output it to some extent, learn the next new thing, and do your best not to get bored or frustrated. If you have any questions even if you google, I think you should ask someone who can do it as soon as possible. It's likely that you're wasting your time.

Development environment construction

First, create an environment for programming on your personal computer.

Install VSCode

This is an editor. I will write a program using this. Introducing useful extensions

command

There are some useful commands to keep in mind. Using commands reduces stress and speeds up development. Personally, I think multi-cursor is convenient. VScode cheat sheet

Install the language you want to use

I'll show you some later, but install the language you decide to use. Example: Python First, download the new one as much as possible.

Use Google Chrome Developer Tools

I feel that it is basically better to use Chrome as the browser. (I have never used it) It comes out by verification of Ctrl + Shift + I or right click, so let's use it in various ways.

Let's utilize Qiita

It's a good idea not only to look it up, but also to write down what you have learned. You can use something other than Qiita, but I think that outputting what you have learned is also good for organizing your own knowledge and for reference later. Qiita is written in MarkDown notation. Reference → MarkDown cheat sheet

HTML and CSS

Strictly speaking, HTML and CSS are not programming languages but markup languages. Famous free teaching materials are Progate, Paiza Learning, and dot install. /)Etc. After that, let's see the official document as much as possible. If you want to design, focus on this. If you want to do python or backend quickly, let's do it moderately.

HTML, CSS MDN etc.

JavaScript If you do jQuery lightly, you can understand how to use JavaScript. It's easy to think that jQuery is old, but I think there are still many sites that actually use it. If you want to do more front end, react.js, vue.js, typescript, etc. JavaScript-specific online learning site JS-Pro

Bootstrap It is interesting to use this as well because the page can be created so quickly that you will be surprised. I think aribnb used bootstrap in famous places. You can easily create a responsive web page. (If you don't understand responsiveness, please see [Introduction] What is responsive web design? A detailed explanation of the outline and how to make it)

Output

If you go through each progate etc., you can make one page for output. How about a self-introduction page? It's a poor one, but I'll put my own one that I made properly using Bootstrap as a reference. For Recruiter Page This is mentioned in GitHub Pages, which is a function of Github described later.

Programming language

Each language has its own characteristics and strengths. Look at this for programming beginners! ← There is an explanation of major languages To get used to the language, try to explain the past questions of competitive programming sites such as AtCoder and HuckerRank. I recommend it. Below are some of the major ones and their web frameworks. C

C++

C#

Go Echo、Gin

Dart Flutter

Java Spring

JavaScript Node.js, React.js, Vue.js

PHP CakePHP, Laravel

Python

As a practice for Django, Django Brothers and [DjangoGirls](https: // For example, tutorial.djangogirls.org/ja/).

Ruby Ruby on Rails

Swift

Object-orientation

Learn about classes and instances.

web technology

You can't make a web application without knowing some web technology. Learn about communications, networks, and security. I read "Introduction to Web Technology to Become a Professional", so I summarized it [Part 1]

Database and SQL

Database structure, middleware such as mysql, relation mechanism, etc. SQL is a language for database operations.

Git Git is indispensable in development, so if you are aiming for business, study it especially well. Saruwaka was pretty easy to understand.

Docker You need to run the application you started building locally. Previously it was necessary to create a virtual environment with Vagrant etc., but with the advancement of technology, Dokcer can now be used on Windows. After windows 10 version 2004 with windows update in April, wsl2 can be used and Docker Desktop for Windows can be used. With Dokcer, not only can you easily set up a server locally and run applications, but you can also manage the infrastructure with code, so the learning cost is a little high, but let's actively use it. Docker Official Introduction to Docker, the most understandable container in the world Introduction to Docker # 1 [What is Docker]

Cloud knowledge

Major cloud services include GCP, AWS, There are Azure and Heroku. You can use it for personal use within the free frame, so if you want to actually run the app, try using it. I am also creating a web application using GCP and Firebase.

Useful material

Recommended Posts

Roadmap and reference materials for web development self-study
Web teaching materials for learning Python
6 Python libraries for faster development and debugging
[2020 version] Development procedure for personal crawlers and precautions
Roadmap for beginners
[For beginners] Django Frequently used commands and reference collection