Giter Site home page Giter Site logo

f2e-awesome / knowledge Goto Github PK

View Code? Open in Web Editor NEW
1.9K 98.0 370.0 11.71 MB

文档着重构建一个完整的「前端技术架构图谱」,方便 F2E(Front End Engineering又称FEE、F2E) 学习与进阶。

JavaScript 100.00%
css html js electron webgl dom canvas nginx f2e server

knowledge's People

Contributors

chenfengyanyu avatar fewy avatar jeyvie avatar luguizhou avatar shaobeichen avatar taoyingsong avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

knowledge's Issues

引用错误

image

这篇文章作者的学习css文章系列, 第四篇, 并不是css4
烦请更正

React Native项目实践

1.搭建开发环境

https://reactnative.cn/docs/0.51/getting-started.html

2.创建项目《React Native高效开发》之 create-react-native-app

https://www.jianshu.com/p/abfb55c60684

3.安装xcode 本地调试使用

4.React-Native学习指南

https://github.com/reactnativecn/react-native-guide

5.项目创建后需要增加

image

6.启动项目

1.进入项目文件 >
2.运行  npm start  启动项目  
            npm run ios  启动iOS版    
            npm run android   启动android版

7.手机上调试需要安装expo (expo 软件第一次打开很慢)

使用照相功能扫一扫 扫描 就可以在手机上查看效果了
image

8.结构架构

image

9.参考资料

https://www.jianshu.com/p/a7416ec82f6d  webview 详解
https://www.jianshu.com/p/abfb55c60684  《React Native高效开发》之 create-react-native-app
https://reactnative.cn/docs/0.51/getting-started.html  搭建开发环境
https://www.jianshu.com/p/91fa0f34895e ReactNative的Navigator组件使用方式
https://www.jianshu.com/p/a69829206ac5  Ionicons官网图标
https://www.jianshu.com/p/96d5c66791c3  React-Native使用自定义字体文件iconfont
https://blog.csdn.net/Marno__/article/details/71809757?locationNum=7&fps=1 50个react native项目
https://blog.csdn.net/chichengjunma/article/details/52920137 react native 第三方组件汇总
https://blog.csdn.net/vv_bug/article/details/6119556React Native 自定义ProgressBar(双平台)
https://www.jianshu.com/p/b7788c3d106e  [React Native]react-native-scrollable-tab-view(入门篇)

10.react native 错误类型 及解决方法

1.问题:React Native Undefined is not an object(evaluating ‘_react2.PropTypes.func’)

  解决方法 import {PropTypes} from 'prop-types';

2.引用数据文件 名称需要加大括号

   例:import { channelData } from '../dataChannel’

3. null is not an object (evaluating '_this3._pressRow') 未bind(this)

    this._pressRow(错误)
    this._pressRow.bind(this)(正确)

4.版本重置:

    $yarn remove babel-preset-react-native   卸载模块
    $yarn add [email protected]   安装组件指定版本

5.Module react-navigation does not exist in the Haste module map or in these directories

(导航控制器已经添加过了,但是还报这个错)
    解决办法: 
     先卸载这个模块: npm uninstall react-navigation
     然后重新安装: yarn add react-navigation

6.(添加自定义字体)Getting Started with NativeBase

      https://www.jianshu.com/p/96d5c66791c3
   a.浏览到node_modules/react-native-vector-icons目录,然后选中 Fonts 目录,将Fonts目录中的所有文件
      拷贝到工程文件目录下,然后将Fonts目录拖到工程文件中,记得勾选Create Groups复选框。
   b.编辑Info.plist文件,添加自定义字体的名称。

image

7.fetch 请求接口模板

fetch('http://ip.taobao.com/service/getIpInfo.php?ip=59.108.51.32’,{
method: 'GET’,
}).then((response) => {
console.log(response);//1
}).catch((err) => {//2
console.error(err);
});

8.第三方组件需要先 安装 才可以使用

安装命令 yarn add react-native-vector-icons
在页面里面引用 import Icon from 'react-native-vector-icons/Ionicons’

9.使用react native 自带组件需要在页面开始进行引用 例如 TouchableWithoutFeedback

import {
StyleSheet,
Text,
Image,
View,
TouchableWithoutFeedback
} from 'react-native';

10.定义样式的方式

const styles= StyleSheet.create({
keywords: {
flexDirection: "row",
},
});
使用方法
style={styles.keywords}

11.分享功能的实现(微信)

https://blog.csdn.net/liu__520/article/details/52809815``

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.