Example: suggestions or books on responsive web design. Example: suggestions or books on responsive web design. Reply content: I will extract four keywords from your question
Html5 webapp learn their books or suggestions in a responsive manner
1. html5 itself is a category...
2. webapp should be built together with css + html + javascript ~ Of course, css3 and html5.
3. Responsive. This is another concept... read the articles recommended by winter and try it out on your own.
In general, the answer is 4th keywords.
By default, you have mastered the basic css html javascript
So you only need to understand the basic html5 concepts and repeat the new attributes of css3, then you can start work directly...
Google just find the problem...
If you want to learn the system ..
I also recommend
Html5 touch interface development and design
I only read this book, but this is just a tool book.
If you want to skip these things and directly play webapp ~
We recommend that you directly view jquery moble ~ in W3C ~ Not to mention performance and customization, but you can quickly build a webapp
We recommend hbuilder's mui framework ~ Quickly build ios system-level ui
I recommend vuejs again... the article winter chicory gave is comprehensive, not only about the front-end work in responsive design, but also about other aspects such as design, as a chicken, I can only recommend a few books (some of which I haven't read yet ...):
Responsive web design: html5 and css3 practices
The cover is a ladybug. In fact, this response is rarely mentioned. Most of the content is about the basic knowledge of h5 and css3, the book mainly leads readers to write a small webpage. If you want to learn more about h5 and css3 and responsive design at the same time, this book is good ~
Responsive web design practices
Cross-terminal web
Html5 touch interface development and design
(Write a bit first, and continue to answer the question after the course.) I will talk about some suggestions on "HTML5 Mobile front-end webapp". If there are books on the market, there must be no "Mobile front-end webapp, if there is something to say, it is basically "Angular. js Guide "React. for example, the js guide, "Mobile front-end webapp" is a relatively large concept. If HTML5 is added, it will be even larger. Discussing "HTML5 Mobile front-end webapp" is just like a backend dog discussing how to develop a "WEB server". We need to discuss different technical frameworks. I feel that if you want to master and be good at developing HTML5 Mobile front-end webapps, You need to master many key points.
The first is mobile webapp. You need to learn a variety of new technologies, such as CSS3, ES2015/ES6, webpack/browserify, gulp/grunt, and Less/sass. Then you need to master various peripheral auxiliary technologies, for example, generating sourcemap for convenient debugging and rem can better adapt to a variety of mobile terminals of different sizes. In addition, there are many details that need to be accumulated constantly. If you can master the above technical points and step on a lot of mobile terminal pitfalls, you can start to study a framework. React is a popular one. js and Angular. js now, more peripheral technologies will be available for you to study. For webapps, routes are basically controlled by the front-end. You should learn a database to control routes, for example, react-router, so OK. If you can master this step, you can start to "H5 mobile webapp". You should also understand the performance tuning aspects, images are the most memory-consuming items on mobile devices and need to be optimized.
No, I think so much for the time being. I can add basic knowledge later.
1,
For HTML + CSS, it is recommended to learn and practice online tutorials.
Then you can imitate some websites to make some pages. After accumulating some experience in practice, you can read one or two books systematically and recommend Head First HTML and CSS
The Chinese version. This book is too detailed. I failed to read it carefully. You can consider it as needed.
2. Javascript has a lot to learn. Without the foundation of other programming languages, it may take some effort to learn it. We suggest you read the essence of Javascript. javascript is a very confusing language. This book helps you distinguish the essence of language and the worst.
The essence of language should be further studied. The dregs can understand the code written by others, so you don't have to try it.
With the above foundations, you can design general static Web pages, but you need to learn more about complex pages.
1. CSS. I must read "proficient in CSS". After reading this book, you should have a good understanding of the concepts of box model, flow, Block, inline, cascade, style priority, and so on. As an exercise, you can read the book CSS artist, which provides a detailed introduction to topics such as titles, backgrounds, rounded corners, navigation bars, tables, and forms.
2. Javascript. The content mentioned above is not enough to make you competent for JS programming. After the foundation, we will further learn the following content:
A) framework.
JQuery is recommended for ease of use. You can use jQuery to complete some simple projects. The learning method is also very simple, according to the product documentation
Just a few pages. You don't have to cover all aspects. You can check the document in the future. The framework can help you shield the differences between browsers, so that you can focus more on the essence of Web Development Learning. Supplement: available
Codecademy is really good at learning Javascript and jQuery (thanks TonyOuyang ).
B) Javascript Language Paradigm
. This name may not be appropriate, but I cannot find the two concepts that can describe "Object-Oriented" and "functional. Javascript is not a fully object-oriented language, but many of its
All the design concepts have the shadows of functional programming languages. Even if you don't need to be object-oriented, you can fully understand it as a functional programming language.
Many of the language features of Javascript exist because of its functional language features. In this part, we recommend that you first learn the basic theories of object-oriented systems.
Understanding: Wikipedia and Baidu will be your helper. We also recommend Object Oriented.
Javascript, which should have a Chinese version. I don't know much about functional programming. If you don't know much about it, You can Baidu.
C) Internal Mechanism of the Javascript language. The following concepts must be clarified: JS
In the scope of the variable, the variable transfer method, the definition environment and execution environment of the function, the closure, the four call methods of the function (General function, object method, apply, call ), and four call Methods
Which of the following points. You will learn more about this part in the essence of Javascript language. In addition, you must understand json.
D) dom programming, one of the core skills of Web Front-end engineers. Must read Dom programming art. In addition, dom programming is well described in the high-performance Javascript book.
E) Ajax programming, another core technology. Ajax recommends that you check some information on the Internet to find out the ins and outs of this concept. The content on Baidu encyclopedia and Wikipedia is enough. Real programming is very easy. Nowadays, almost all frameworks have good encapsulation of Ajax, and programming is not complicated.
F) understand the differences in browsers. This part includes CSS and js. There are many differences in browser content. We recommend that you accumulate more content in practice. In addition, DOCTYPE and other content should be systematically learned for the browser rendering mode.
3. HTML5 and CSS3. HTML5 specifications were released in October 28, 2014. Mobile HTML5 and CSS3 have been widely used.
Level 1-code:
With the above knowledge, you should be able to write code that can work for most small websites. But to become a more professional front-end, you still need to work hard. Higher requirements include four aspects: 1) easy to maintain, 2) testable, 3) high performance, and 4) low traffic (Mobile End ).
1) easy to maintain. For pages, you should understand the separation of 'style', 'data', and 'hangzhou', which correspond to CSS, HTML, and js. For JavaScript code, you 'd better understand the design pattern, refactoring, MVC, and other content.
2) testability.
3) high performance. Must read high-performance Javascript
4) low traffic. Mobile Terminals focus a lot.
5) for students who want to learn the front-end, especially their self-taught partners, self-study is not permanent. If you have no determination, find a training institution.
Level 1 Engineering:
Front-end projects also face various stages of the software life cycle. The first is code management. You must learn to use Svn and Git. The second is code construction. Currently, front-end code construction is not simply compressed, and dependency management, module merging, and various compilation are required, learn to use front-end building tools such as Grunt and Gulp.
This is the basic content for front-end development. You can choose to learn the following content based on your interests and interests.
1. interaction design. Large companies still have professionals doing this, but front-ends that do not understand interaction must not be good ones.
2. backend.
It should be said that some engineers have to understand at least one backend language. However, if you are interested in it, you can also learn it in depth. PHP is the most difficult to start. This part can be divided into two types: page-based and framework-based.
Large projects are developed based on frameworks. We recommend that you understand at least one MVC framework, such as PHP Ci, Yii, and Yaf.
And so on. NodeJs is now widely used in large companies. We recommend that you use the Express framework on Node for backend service development.
.
3. Android and IOS development.
Today, the front-end work field has been very extensive, and native Interface development is essentially a front-end development. Big companies are faced with the problem of simultaneous maintenance of Native and web environment pages, if it can be technically unified, it will be of great value. For those who have knowledge about Native development, they should understand the basic process of Native Development and at least the interface construction technology. Books
JavaScript Mobile Application Development
Mobile JavaScript Application Development-O 'Reilly Media
Mobile First Design with HTML5 and CSS3
Responsive Web Design by Example
Sencha Touch 2 Mobile JavaScript Framework
Mobile HTML5-O 'Reilly Media
Responsive Web Design by Example
HTML5 and CSS3 Responsive Web Design Cookbook
Responsive Web Design with HTML5 and CSS3
Rwd
Media Queries
Responsive Design Knowledge Hub
Follow spec.
Standards for Web Applications on Mobile: current state and roadmap
The HTML5 touch interface design book is very good at www.w3school.com.cn/
Familiar with the relationship and differences with HTML, familiar with CSS3 (responsive layout), drawing APIs, and the use of related jsapis
Chapter 1: HTML5 Overview
1
The development of HTML, the birth of HTML5, the relationship and difference between HTML5 and HTML
2
HTML5 goals, HTML5 and previous HTML syntax changes, new elements, abolished elements, and global attributes
Chapter 2: HTML5 Basics
1
Add document structure elements (Article, section, nav, aside, header, footer, address)
2
Form improvement (input improvement and addition of output elements), verification, and custom error information
3
File API (FileList object and File object, FileReader Interface), and drag-and-drop API (custom drag-and-drop icon)
Phase Project: review specific knowledge points, compare with HTML4 document structure, and be proficient in using new functions of forms and files
Chapter 3: CSS3
1
CSS3 concepts and differences between CSS2, new descendant selector, and new pseudo-class selector (before, after ...)
Selector Problems
2
Text-shadow, word-break, and Custom font (@ font-face)
Text-related
3
Border-radius, border image, box-shadow, and alignment
Box-related
4
Transform, transitions, key-frames, and rotate)
Animation
5
Angle of View (perspective), deformation type (transform-style), dot (transform-origin), 3D Rotation
3D
6
Concepts of responsive layout and syntax (@ media), differences between web pages and mobile pages, and style inheritance
Responsive Layout
Phase Projects: classroom case study, Homework completed, 2D (Netease mail homepage Dynamic Graph wall Report) and 3D animation (3D City Simulation)
Chapter 4: HTML5 advanced drawing
1
Canvas label basics, drawing a rectangle, drawing a circle, using a path, image cropping, saving as a file, simple animation
2
Basic knowledge of the Svg system, Functional Comparison with canvas labels, differences with canvas, and animation Rendering
Phase Project: canvas achieves galaxy rotation, svg achieves cute Q baby, clock
Chapter 5: HTML5 advanced multimedia
1
Multimedia concept, audio element, audio element javascriptAPI, audio callback event, audioContext
2
Video element, Video element javascriptAPI, and Video callback event
Phase Projects: Tanzhou music player (synchronization of music playing, lyrics, music and music videos)
Final article: HTML5 enterprise-level practical technology
1
Local storage web storage, basic concepts of local databases, and basic SQL
Local Storage
2
Concept of cache, difference between local cache and browser Web Cache, applicationCache
Local Cache
3
Basic Communication Knowledge, cross-document message transmission concept, webSocket Communication
Communication
4
Basic positioning knowledge and principles, GeolocationAPI for geographic location information, and google (AMAP)
GPS and positioning
5
PhoneGap implements various sensors, Photometric sensors, direction sensors, and gravity sensing.
Sensor
Phase Project: Each project has a corresponding project case.
Integrated Project(Sina Weibo mobile phone responsive layout website Tanzhou micro mall development and other enterprise responsive mobile phone websites)
Recommend a blog. Front-end learners should know more about the homepage» Zhang xinxu
, Hope to help you
