“Live up to the time, the creation of non-stop, this article is participating in 2021 year-end summary essay competition”

My heart has been taken by the code, this life may not be happy.

Today is the last day of 2021, netease cloud push for me on the subway annual summary, then turned to a need to do a Denver’s version of the annual report, and then with this article, reviewing this years of efforts, look at your goal how far away, but also give a spur yourself a year later, don’t stop learning steps to move on.

Nuggets annual report

Hello, Nuggets!

Other platforms

Making and cattle

At the front

In 2021, my first year on the front end, I chose computers because I thought computers were the answer to the current version (cloud native + metaverse, so cool!). In my freshman year and sophomore year, I have a full schedule of classes and a license of cet-4 and cet-6. In my spare time, I do homework and play games. I have no future plans and no goals for the future, so I muddle along. In contrast, the outstanding peers have already set a good goal direction and strive for…… To the three or four years of employment to take an examination of the three choices, (school nearly half of the people take an examination of grind, really on the national grind. Ah!)

Until junior year under close to summer vacation to decide to choose the front-end (late), is a cross-border electricity company in guangzhou, Macao ebay business pick up soil, shopify this electric business platform project and the company’s internal project, page also mainly mall, activities, logical words is nothing but a variety of holiday promotion, such as discount coupons, is also quite tedious. The work is mainly to touch fish (not touch fish, is really not live much… A foreign company, colleagues also have foreigners 😂, 4:30 on time to clock the crumbs, although I am 😅)

I think back to the early days when I was a bit of a mess, HTML with all the tags and CSS styles, learning and trashing, document flow, responsive layout, etc. Even if is the language of the two “simple”, also can’t proficient in, could only imitate to write page, PC response type, H5 side, don’t write to open the console copy style, so get to the JS JS many features when beginners often make heads (implicit type conversion rules, this binding rules, closure scope chain, Prototype chains, various inheritance, event loops, various API usage parameters…) Then came Vue, applets, Uniapp, React…….. That was the beginning of my journey. The goal is to become a front-end engineer who can take charge of the whole stack.

Autumn recruitment and interview experience

After all, I entered the industry late, master the knowledge is very limited, near the end of the autumn recruitment began to cast (October ~ November), but also to strive for more than ten interviews with large and medium-sized companies, the way is mainly cattle on BOSS online on line, interviewed Daoyiyun, rice technology, Circle quantity technology, Beisen, deep convinced and some small factories, Deep convinced is on cattle guest (started 4 test hand code, directly to the interviewer explosion killed) hand code and algorithm I am still very weak, now also keep practicing every day algorithm ability (strong push website code hakuouki zuisouroku algorithm, the force of subject points module column good sequentially brush), finally also get some offer. As for the city where I work, my family is firmly opposed to going out of province (Guangdong). I don’t care about it, probably because I’m a little rebellious. I think it’s a good thing to be far away from home. Basic consumption is food, drink and accommodation, so when it comes to food and accommodation, even compared with Beijing and Guangzhou, there is no big difference in consumer spending. I really think it doesn’t matter where you work, especially now that e-commerce is so developed, the price of online shopping is the same. Guangzhou is actually quite suitable for life, is the Internet compared to other big cities to pull crotch (compared to the north, deep Hangning). In addition to the wechat leader, other points less brand surface, down the number of happy Gathering times, NetEase Leihuo Youdao, Vipwill, probably turn to duoyi, 37 mutual entertainment, CVTE, 4399 three pits (like in addition to duoyi, the other are not so pit)… Guangzhou local feel xiaopeng car development momentum is very good, the car is also very good-looking 🤗

Work environment and atmosphere

The environment is about the same, are to the computer to do development, more like is ergonomic chair (this thing is absolutely programmer necessities!) It was torture for me to sit on a chair with inappropriate height, insufficient support strength and airtight cushion. It caused pain in my back and buttocks in less than 2 hours. Ergonomic chair can provide strong support for lumbar vertebra and cervical vertebra, and the breathable and soft cushion ensures that my buttocks will not hurt after sitting for a long time. (Of course, the most important thing is to get paid to touch the fish every hour or two, the body is the capital of revolution!)

The atmosphere of the company is more easygoing, do not advocate overtime, flexible work, early to early off work, off work and weekends are unable to find people, demand is not much, can be said to be the model of the anti-volume. I may be the company’s most “volume”, free to touch the fish to write notes brush cattle brush algorithm 😄, every time the technical manager hit water from the side through all staring at my screen 😏.

Introvert and overtime views

Personally, I am against inrolling. Inside the volume is an endless thing, but the environment really volume ah, so not volume is impossible, even Liao Xuefeng this cattle are saying 35 years old crisis, make stock sideline and so on, I this rookie how can not worry about the future? Look at all kinds of big job ads: stress their technical team 2X years old, 35 years old crisis is just a sign, don’t learn to keep pace with The Times will only be a dead end. So only continuous learning technology, familiar with more business in order to share in this wave of volume, so volume!

Overtime will score the situation, because the normal project on-line or change the demand at this time the probability of technical personnel is to work overtime, so it is a very normal thing, of course, overtime pay is also very normal, and double. But I refuse to work meaningless or intense overtime. Programmers are human beings, not robots, but also have their own lives. The best solution is to combine work and rest. There is a clear example around, (two roommates are practicing in Guangzhou Pacific) Pacific squeezing interns can enter the code (internship pay is high, so squeezing), regular workers do not work overtime, the demand is directly pushed to interns, interns work until 12 o ‘clock to 1 o ‘clock every night, even directly live in the company. At the same time, he looked for Zhongda Shiji University to improve the rate of elite schools, and kicked out the old interns. An intern from Jinan University, led by my roommate, could not write it even in a static state, because jinan University recruited him to 😅. Finally, his roommate helped him complete the task, and then cancelled overtime and housing subsidy. He has applied for leaving this week. Feel quite outrageous, listen to give up a friend to say every day engage in what agile development 🤣. Unless the money can give as much as fight duo duo, otherwise who will be silly to squander their most precious youth to you when coolie. 20 years old high intensity work for so long people have to be broken, appearance is probably dull eyes eyes without light, stay up late endocrine disorders lead to acne full of the whole gaunt face. Double rest and reasonable go to work time are laborer due right, nots allow anyone to infringe.

Work learning techniques

With the exception of Nuxt and Tailwind, they are all things they are trying to learn, and if they have nothing else to do, they are advocating learning new technologies to improve themselves.

Nuxt.js(SSR Framework based on Vue)

The company is mainly engaged in cross-border e-commerce business in Australia. What e-commerce websites need most is SEO, and the front-end framework is Vue, Angular(really, haha), and some old projects still use JQ. Of course, mainly Vue, because of the need to do SEO, so it is appropriate to use SSR(server-side rendering) framework Nuxt.js, NUxT. js is based on Vue SSR integration framework, this I just heard about the concept of SSR before, but Nuxt what did not hear, so it is also recently contacted. Found that nuggets also use nuxt. js to do SSR😁 Nuxt is still better to get started, there is a Vue basis follow the document to do a basic familiar with, based on Vue3 Nuxt3 also came out, but the overall business is based on Vue2, Vue3 is just a personal learning to use.

TailwindCSS

This is one of the most popular (and controversial) CSS frameworks in recent years, with obvious pros and cons, and a new version 3.0 was recently released. The advantage is that atomic classes are highly customizable, and Tailwind has ALL styles integrated into HTML, or ALL in JS if you’re using React. Using Tailwind means you don’t need to store separate CSS folders, and you don’t have to agonize over CSS class names. What is more important is the unification of design ideas and standards. A quote from the official website might make sense

Simply put, it is not necessary to manually assign values, but to design according to pre-set values, such as left and right spacing, can use MX-5, not say one more or one less px in a place, this unity of units will make developers do not have to worry about unit calculation, but also achieve page coordination.

The disadvantages of Tailwind are also obvious and require a lot of work, and many people will resist Tailwind because they don’t want to or can’t work with it, such as breaking HTML structures. Pattern memory burden increases… Cumbersome packaging configuration…

A few more obvious shortcomings are summarized roughly

1. Tailwind officially provides a component library for a fee and the price is high.

The price is shown in the figure below, which is quite expensive. The company bought it with a set of implementation framework, so it is also used.

2. Packing problems

If left untreated, Tailwind’s package is close to 4MB, and a CSS file is 4MB, which is unacceptable in any production environment. So using TailwindCSS also requires configuration (a bit of a webpack dream). You need to install postCSS and configure the Purge option. Purgecss automatically removes unused CSS and directly reduces the CSS size. But there are still flaws, and sometimes classes are not packaged, depending on the official solution. It is highly recommended that Tailwind integrate the packager with the framework and use the build once NPM is installed. Tailwind’s development experience will be much better!

3. Integration with other ecosystems

Vue, React, and pure HTML are available. Laravel8 also uses Tailwind instead of Bootstrap, and can also work with CSS preprocessors such as Sass/Less/Stylus. When I first saw this framework, I thought it was perfect for React. This allowed me to combine structure (HTML), style (CSS), and logic (JS) into JS. The official demo was also based on React, but there was a slight problem with React. Styles in React are written using className, so classes need to be replaced.

Bootstrap5 and Sass

The famous Bootstrap has been used for a long time. I used the old version of 3 before, but I will directly use the latest version 5 this time. The biggest feeling after using it is that Bootstrap5 is similar to atomic class in many aspects, it can be said that Bootstrap5 and Tailwind share most of the same ideas. For example, it’s Mobile First, responsive implementation is the same, and a lot of syntax is the same, but Bootstrap5 has a much richer component library with pre-written styles from the official website, whereas Tailwind requires you to write your own CSS, so there are not many ready-made components. Tailwind’s official component library is available for a fee, while Bootstrap is completely open source and free. Bootstrap also doesn’t need to be configured manually like Tailwind, so it’s practically out of the box.

CSS preprocessor has been used Less before, the company uses SASS, because the basic learning cost of Less is not high. The only problem with Sass is the Node-sass package, which seems to have been used by every front-end er with sass. New projects should also embrace Dart Sass and abandon Node-Sassl.

Applets and MP-vue

The company’s internal small program is made with the framework of MP-vue. Mp-vue is a KPI project of Meituan open source, which was not maintained long ago, so it was left to me. ????? WTF, what logic 😅 VUe-based cross-end in addition to MP-Vue and UniApp, Uniapp is now more mainstream and better implemented Vue cross-end framework, also used uniapp to write a toy project. These cross-end frameworks say that a set of code is deployed at multiple ends, but in fact, they do not have to deal with compatibility issues themselves, or they have to write the code on each end. They say it costs less than native, but it doesn’t feel like it. After comprehensive experience of different cross-end schemes, it always feels that the cross-end is a pit. Whether it is Uniapp, Flutter, RN, etc., we have to make do with it. The real pursuit still has to be original, but learning may also have to be learned. Summary: Cross end is pit. Think before you jump

Node and egg.js (perhaps Nest.js)

The initial knowledge of Node.js refers to installing the Node environment, as well as NPM package management and commands. Really start to understand node is influenced by the leader, crazy said that the front and back end are written in JS, really cool. Node content and JS content is similar, but because it is based on the server, file IO operations, OS modules, Stream, Buffer and a lot of knowledge still need to be deeply understood. Node framework after comparison, the selection of egg.js based on KOa to learn. (The reason is that although epxress is used by the most people, it does not have async/await, and there is no outstanding update recently. The reason is that express cannot handle AySNC and AWIat, so we finally choose Ant Financial’s open source egg.js and Nex.js. A typescript-based Node framework. TypeScript is not currently used or required internally. But you have to learn the whole environmental trend. But it does work, because my interviewer was working on ng(Angular) projects and had to write TS. As for egg.js, the documentation is quite good. I started to get used to it and simply built several demos to do CRUD. The learning cost is not high, and I will consider Nest.

Books to read this year

JavaScript books

• JavaScript Advanced Programming (4th Edition)
• JavaScript You Don’t Know (Volume 1)

That is, the little Red Book is sealed as the front-end classic and the advanced version of the little Yellow Book, the little Red book will not say, JS encyclopedia, the front-end classic is really worthy of, the little Yellow Book (volume 1), so that I have a deeper understanding of the function and scope, scope chain and prototype, prototype chain. The book is available as an open source ebook on Github and is definitely worth checking out!

Computer network

• Illustrated HTTP
• Diagram of TCP/IP

Two more general computer networking books with graphics that don’t look too obscure and can absorb the dry stuff. Seems to be relatively fast, very convenient review or fragments of time to open a look, consolidate the foundation of the network. As for the advanced version, I haven’t had time to read it yet, and these two books are enough for most of the time.

Data structures and algorithms

• Aha! Algorithm!
• Introduction to Algorithms
• “Code Thoughts” karg just published, immediately placed an order.

No suitable JS algorithm book was found. A random copy of Aha algorithm. Although it is realized by C, the examples are vivid and interesting, and the algorithm principle is explained with diagrams. It is too friendly to me that there is no basis for this algorithm.

Introduction to algorithm is on the algorithm class textbook, do not understand, send! 😇

Algorithm brush exercises or special programming, buckle, and code is the algorithm site, really very good.

Adjustment of learning state (into flow)

There are three kinds of learning states:

• The first anxiety state is when you feel pressured to study and want to get things done quickly. (Liver needs)
• The second kind of boring state, learning feeling very boring and boring, direction, goal is not focused. (Bored and looking for something to read)
• The third isThe flow stateAnd lose track of time when studying intensively. (Read with immersion and think)

Think about your state of study and your state of play (manual dog head 🐶)

The definition of flow: in psychology, it refers to a state of mind that people show when they are engaged in a certain behavior. Such as the artist in the creation of the performance of the psychological state. Usually in this state, there is a reluctance to be disturbed, also called resistance to interruption. Once we’re in flow, it’s easy to get caught up in it and not feel tired.

When we play a game, for example, we can enter flow without adjusting our state. During the play, we are so focused that we can’t hear others call us. You lose track of time, you don’t think it’s time to eat. It’s annoying when people call us.

But it’s hard to get into flow when you’re studying. I’ve always thought about stealing and swiping my phone, but lately I’ve started to find some ways to get into flow. It’s just for me, but it should enlighten you.

Getting into flow isn’t easy, but aim for it.

Why do you get flow in seconds while playing video games? But study can’t? Because you like the game, the game developers will first consider how to make you mad, plot design to develop different levels of difficulty, think about your game state, when you first started playing technique sucks but the game will give you all kinds of tips, so you can play and customs clearance, it brings you a sense of accomplishment, and the next difficult to ascend, you begin to master game skills, You start to get more and more excited because the difficulty of the game roughly matches your level of play, and you don’t get bored because it’s too easy, and you don’t get frustrated because it’s too hard.

The trick to flow is that the game’s ability roughly matches the game’s difficulty.

So you can get into it and play games. In the same way that all games match players of the same level, you are generally at the same level, so you can play back and forth, without the frustration of being knocked over by a great god, or the boredom of killing a few rookies.

Difficulty in learning to flow is a mismatch between learning ability and knowledge difficulty

Think of the first time you read a document and see something that is difficult to understand. Your first reaction is resistance and then anxiety. Your mind becomes impatient and impatient. In this way, even if it is a very simple thing, because you have no patience to look and understand, a lot of knowledge is still not mastered, the learning efficiency is also low, and the following chapters and contents naturally do not understand, and constantly fall into a kind of nausea cycle.

The key to learning to get into flow is that you don’t reject learning, it’s rewarding, and it’s acceptably difficult

Looking back on my previous learning state, I think there were probably several scenes where I entered the flow, immersed in the current thing, and completely forgot the existence of time

1. Write notes and summaries. Vscode opens Zen Mode (CTRL + K then press Z) to enter Zen mode, 6 roots clean, and start sage mode crazy code word. Notion: notion that something will not be recorded when you see it. Then extend different knowledge points according to this knowledge point, once begin to sort out out of control, gradually build up their own knowledge system.
2. With a specific goal in mind, like getting XXXX done today, go over your TODO list every day when you wake up and before you go to bed, and make it a habit to push yourself so that you don’t lie about your plans.
3. Timely feedback (rewards). Learning requires input and output. Only by using what you have learned can you master this knowledge. After watching the video, you feel that you understand it but you don’t follow the code; after reading the document, you don’t write it by yourself. If you keep getting killed, you’ll soon get frustrated and want to quit the game. You’ll feel good fighting back and want to keep playing. Study should be the same, study makes me happy (fart! . If learning does not make you feel happy from your heart, it is still a very painful thing. Therefore, I think that after completing a goal, it is beneficial to continue learning to relax and reward yourself for a short time. Instead of suppressing and studying, it is better to reward feedback in time.

Leisure time

Everyday after work

I have a wide range of interests. I don’t want to type code after work, so I just write summary notes and brush down videos. I also play less games (punishing the cuter, I just finished punishing.jpg). ⚡ ️ 🌪 🔪! , anyone who gets the joke should go to hell). Exercise less, after all, I am busy, I feel my body is worse, and I eat better for a long time, and my weight keeps growing

anime

Saw people

Excellent storyboard and unrestrained imagination and absurd but reasonable plot direction, next year’s animation is a blast.

Inflammation fist

God diffuse, after watching the flame boxing, think chainsaw man is no more than that. After reading, I felt empty, as if life had lost its activity, and I didn’t want to think about anything.

eva

I just started to watch Eva this year, which is the end of this year. I also grew up to be an adult (social animal) just like the teenagers in the play. In the process of growing up, I also completed the “completion” of myself, which can be said to be empathy. Goodbye, all EVANGELION

jojo

Finished watching Jojo, in general, a little retardation (manual dog head) to see the painting style was rejected at the beginning.

Dream as a horse, live up to youth

Expectations for the future

There’s a lot to learn. You can never stop learning. You can learn as much as you can about new technologies (WebAssembly(WASM) and Rust) while doing a good job in your business. After all, dealing with people is much more difficult than dealing with programs, and insist on training algorithm questions and handwritten code ability, a daily stick ~

Thank you for the Denver nuggets

First of all, I would like to thank the nuggets platform. I began to understand the nuggets platform when I taught myself front-end in the summer vacation. Most of the creators of nuggets are front-end, and after digging registered nuggets, they must brush almost every day. Other technology platforms such as CSDN, Blog Garden, Jianshu and Zhihu are all on the decline. (We don’t know when the ethos of the Chinese tech community was damaged…) CSDN is the culprit. Blog park or quite enterprising, rectification before quite a long time. Jane discriminates against programmers, not to mention programmers. Zhihu is mainly about watching Judah take goods and quarrel. Now the Chinese community feels the only thing left to watch is gold digging and thinking. I feel like I’m learning something new every day in Denver, and I can say that the nuggets and their articles have helped me grow a lot.

Learn from the nuggets

Nuggets really hidden dragon and tiger ah, Sunshine_Lin three heart elder brother chokcoco elder sister shark elder brother a bao elder brother LinDaiDai Lin dull……. There are too many big guys, every time on the Nuggets can brush, hey, hey, hey, and found in Guangzhou a lot of ye 🤤🤤🤤 YCK big guy wrote a front-end interview nuggets book to give me a lot of help, and React Contributor magician Cazon brought React source code reading series, deepen your understanding of React. Every time I read the fine articles contributed by big men, I can always learn something. Finally, I would like to thank my roommate @chor Longge for asking me 🤤🤤🤤 for all the questions I don’t understand.

The final summary

As the nuggets’ motto goes, cease to struggle and you cease to live. No matter what line of work, continuous learning is a must to master the ability, people who do not have the ability to learn by themselves have no future. Programmers are paragons of lifelong learning who are prepared to learn as long as they can.

Finally, the last excerpt of a paragraph to end it, worth pondering a paragraph ~

“Those who cannot teach themselves have no future” — excerpt from a book of the same name

There are two factors to consider deeply for self-study: the days ahead are long, and the world is moving so fast.

Society is developing faster and faster, we have to face a longer and longer life, there is no future, how to live? The ability to teach yourself is the only skill worth honing.

The great thing about honing our ability to teach ourselves is that whenever the world needs us to learn something, we can do it, and we can do it right away — without waiting for someone else to teach us.

Of course, having strong self-learning ability does not mean that you can learn everything at once, learn everything at once, and finally master everything… Because there’s a time issue here.

No matter what you learn, it takes time and energy, and the harder thing is to keep filling your patience in case it runs out prematurely.

And, in extreme cases, there is a talent problem.

Human learning is like animal evolution… Many people stop evolving long ago.

In some competitions, being one step ahead means more education, more time in the gym or library, better nutrition, more sweat, better endurance or better equipment. These can be learned by self-study.

Thank you for reading this, I hope you can learn something from my article, I am Lara Lavard, wish you to coding change the world!