Summary from a senior front-end developer: What do we need for “front-end” development?

I always think that "tools" are the most productive force. Why is it said that "tools" became very important after the "First Industrial Revolution" in Britain and the invention of the steam engine? But sometimes I wonder, is it really so? I started to experiment with ecological agriculture in my hometown of Xiangxi, which is more about the utilization and research of biodiversity. The combination and transformation of the food chain can produce organic food, and the use of measuring tools has played an indispensable role.

So what kind of tools do we need on the “front end”?

Mac OS X is based on Unix, which is very important. It means that you can pick up a lot of good things under Unix. Believe me, you deserve it. The development environment and various shells on Mac are all available. You are welcome to use them. Moreover, Mac's tools and operation methods can immerse you in the world of programming, which invisibly improves the efficiency of programmers' production and conception.

With a retina display, you will pay more attention to details. I have always believed that "details" determine everything. Good products have details that make people feel comfortable and retain "repeat customers".

Therefore, Mac OS X is the best tool for development that I think so far. No matter from the perspective of program running efficiency, tool diversity, and Unix compatibility, it is my only choice.

Without further ado, I would like to recommend a book by Professor Chi Jianqiang, "MacTalk Metaprogramming of Life", and an open source project to collect and recommend excellent apps/hardware/skills/peripherals, as well as summarize personal methods and tools to improve front-end efficiency in 2015. It would be your loss if you don't take a look.

In the previous blog post, I explained the tools and methods I personally use to improve efficiency. Today, I would like to further elaborate on some of the conclusions I have made over the years: What do we need?

state

Judging from the current situation, the popularity of the "front-end" industry can be described as "explosive". Whether it is the original development technology on the PC side, the "framework" that has expanded in recent years on the mobile side, ionic and react native for hybrid development of mobile apps, cylonjs and osbean for connecting hardware, and Nodejs on the server side, all indicate that the applicability of the "front-end" language, JavaScript, has exceeded many people's expectations. So I need to ask myself, "Can I learn it all?"

Obviously, there is no end to learning.

How to set sail

If you are a beginner, I think you will probably be scared by this "thing". To be fair, we should learn to adapt to it and find a direction from your career plan. The direction will guide your path. Buddhism talks about "direction" based on the actual situation of practitioners, so we should also start from your career plan and find a direction.

Some tips on how to get started:

For beginners, HTML, CSS, and JavaScript are your only entry point. If you are on the other hand, I sincerely recommend Apple's Swift as your entry language. Why? Because you need to understand the essence of the program. Swift can help you understand what a type system is, what object-oriented is, and what a compiler is.

Understanding the "procedure" is the beginning of your journey.

The front end might look like this

Having written this, I feel a little emotional. So this is what the "front end" is. In this era of fast iteration, meticulousness, and user experience, if you only have div+css layout and can write some animation effects, you will undoubtedly be eliminated in the next five years.

What do we need?

Mobile is definitely the biggest player in work, so do we still need PCs? Yes, after all, many scenarios still need to be completed on computers. For example, when you are working, you may browse some websites and place orders on your work computer. Is the market big? It is as big as the number of people working.

As a person who has been through it, I seriously say that what we need is to liberate our hearts. As the old saying goes, the bigger your heart is, the more power you have to move forward. Maybe you are not in the field of programming, but your style will bloom in other fields.

Well, unfortunately, you chose "front-end", you also need firm belief, belief is the cornerstone that allows you to persevere, and it is the source of strength for you to continuously improve your professionalism. Many people say that programming is a job for young people. I personally think that programming is a liberation of young people's thoughts and the beginning of the formation of logical thinking. The intangible value it brings to you is better than the tangible value such as "money", although "money" is also important.

You also need to plan. These days, I often sit on the top of Xuefeng Mountain to look at the stars. I feel more and more that I am insignificant and that time is precious. If you don’t plan, you will only waste your time on trivial things, and your learning will not be systematic and your practice will not be precipitated. The human brain is a container, but as time goes by, many pieces of information will be forgotten.

You also need to "give up". Learning to give up may be difficult. Indeed, giving up is the beginning of everything for you. No matter before or after, you must have a mentality of starting from scratch and face these things tirelessly.

[[142606]]

On rainy days, I would also drive a tricycle to haul sawdust. Of course, when I say give up, I don’t mean to give up your field, but to keep in awe. That’s how life is. After hauling sawdust, I would go to Xiahe Street to eat rice tofu and rice noodles.

[[142607]]

***You also need foresight and understand the future development trends of technology so that you can keep up with the team. So where is the foresight?

http://skill.phodal.com/ This project can at least keep you sensitive.

Stay tuned for the Google and Facebook Developer Conference.

Try to participate in some community activities, such as JSConf and CSSConf to learn about domestic latest trends.

Diligent

For you, this is just the beginning.

Personal advice:

Swift is a great place for you to learn about programming. The Chinese version of Apple's official Swift tutorial "The Swift Programming Language" has now started Swift 2.0 translation~

Start learning CSS layout, and also learn HTML by the way (don't look at me, this is really easy), and then come to a guide to make it easier to understand general CSS notes, suggestions and guidance

Learn about the basics of JavaScript in the Standard Reference Tutorial (alpha), and also take a look at the simple use of jQuery

Congratulations, you can create some PC websites.

Now let's start by looking at the programming style guide Airbnb English (Chinese translation) and Google JavaScript Style Guide. Good habits are the basis for you to go further.

Uncle Tom's translation of the In-depth Understanding of JavaScript series (maybe a bit old, I remember reading it three or four years ago), but it doesn't matter as long as it is not ES2015, it is still useful. By the way, if you have time, you can also take a look at "JavaScript Mode"

It is recommended to start with Angular, learn an MVVM framework (in fact, it can also be regarded as "MVC", but C becomes ViewModel), an introductory resource AngularJS introductory tutorial - provided by the AngularJS Chinese community, and then further translate "AngularJS" into Chinese - "AngularJS", as well as modular thinking.

Then learn your first automated build tool, gulp. It’s all in Chinese. Boy, Gulp

Try SASS, your first CSS compilation tool

Congratulations again, the copy is about to be upgraded, and now you can try the WebApp.

To further change the way we develop, learn git. I heard that even a monkey can learn it.

Start trying to learn HTML5 and CSS3 Tutorial. If you don’t learn this, I can only tell you that you will definitely suffer.

Prepare the summarized projects Mars-Tencent Mobile Web Front-end Knowledge Base and the open source summary mobileTech made by a friend I knew before. By the way, take a look at zepto. Is it very similar to jQuery?

Nodejs is also something you can't miss. Learn NodeJS and "Node.js - Teaching but not Learning" in seven days

At this time, you haven't upgraded yet, but you can start trying to make some Nodejs-based tools and HTML5 mobile websites. Comrade, you have a mobile tendency.

Mac tools are your best friend and mentor. They recommend to you the methods and tools that can help you improve your front-end efficiency in 2015.

You can take a look at ECMA6 and promises

Learn about the hybrid development framework ionic

***Take a look at the JavaScript tutorial rewritten for Firefox Re-introduction to JavaScript (JS Tutorial)

This time, ding, come on, brother, make your first app and release it to the market

By the way, I would like to recommend an App manong-reading to everyone. There will be an aggregation of the weekly "Coder Weekly". It is a good choice to use fragmented time to study. I also recommend the pure-blooded "Developer Headlines" App.

So far, you have laid a good foundation for "front-end", and further study is up to you.

The future is written in ***

Multi-screen devices are the battlefield where you go all out. Whether you can win or not depends on your belief, courage, planning and "giving up".

At the age of 26, I am starting over for the future of "ecological agriculture". What about you?