2016年08月_学习笔记666

原创 Git分布式版本控制系统基本介绍

在服务器上安装gityum -y install git创建一个叫git的用户 useradd git设置密码passwd git使用git用户登录服务器 su - git创建空的仓库 cd ~ git init --bare project1 windows上安装git客户端下载地址：https://git-scm.com/download/win 需要注意的步骤

2016-08-31 20:42:33 531

原创 sass实战演练01 - 外部文件引用和变量

SASS是什么？目前前端开发中css已经是公认的”前端程序员必须掌握”的知识，最早的css编写都是手工一条条写出来的，工作量大、不利于维护。而sass的存在使得css开发可以像写代码一样最终生成一个正常的css文件。我们直接开干新建一个文件，后缀名为scss（为什么看到有的资料是.sass?） sass有2种语法： 1.一种是以sass后缀，对代码的排版有着非常严格的要求，而且没有大

2016-08-30 23:18:22 8536

原创 React Native商城项目实战16 - 购物中心详细页

逻辑分析：首页（Home）加载的购物中心组件（ShopCenter），传递url数据； ShopCenter里根据url加载购物中心详细页组件(ShopCenterDetail)， ShopCenterDetail中利用WebView展示。1.Home.js/** * Sample React Native App * https://github.com/facebook/react-

2016-08-29 16:55:44 5489 1

原创高逼格Babel，快速入门

为什么要使用babel？目前ECMAScript 2015（ES6）已经极为流行了，只不过目前浏览器还不兼容。所以babel出现了。babel的特点 babel是一个js转换器（平台），它的出现使得我们可以立即使用ES6的语法，特点如下： 1.目前公认的对ES6规范兼容最高的工具 2.不断更新并且支持ES6的转化，我们用babel能做大量的新语法的实验 3.内置优化器，能够在一定程度上加

2016-08-27 21:33:04 1511

转载 magento 根据分类ID或名称获取该分类下的子分类

<?php $mo=Mage::getModel('catalog/category'); $id=13; $mode=$mo->loadByAttribute('entity_id',$id); 这里是设置条件、根据类目实体ID 查询 //$mode=$mo->loadByAttribute('name','Electronics'); 这个是根据类

2016-08-26 16:55:55 1429

原创 React Native商城项目实战15 - 首页购物中心

1.公共的标题栏组件TitleCommonCell.js/** * Sample React Native App * https://github.com/facebook/react-native * @flow */import React, { Component } from 'react';import { AppRegistry, StyleSheet,

2016-08-26 10:03:12 5099

原创 React Native商城项目实战14 - 首页中间下部分

1.MiddleBottomView.js/** * Sample React Native App * https://github.com/facebook/react-native * @flow */import React, { Component } from 'react';import { AppRegistry, StyleSheet, Text,

2016-08-25 13:55:17 1770

原创 React Native商城项目实战13 - 首页中间上部分内容

1.HomeMiddleView.js/** * Sample React Native App * https://github.com/facebook/react-native * @flow */import React, { Component } from 'react';import { AppRegistry, StyleSheet, Text,

2016-08-25 11:15:47 775

原创 React Native商城项目实战12 - 首页头部内容

上图说明：HomeTopView为首页头部内容，HomeTopListView为HomeTopView子视图。1.HomeTopView.js/** * Sample React Native App * https://github.com/facebook/react-native * @flow */import React, { Component } from 'react';i

2016-08-24 15:13:11 1592 2

原创 React Native商城项目实战11 - 个人中心头部内容

1.创建MineHeaderView.js/** * Sample React Native App * https://github.com/facebook/react-native * @flow */import React, { Component } from 'react';import { AppRegistry, StyleSheet, Text,

2016-08-24 09:32:23 2994

原创 React Native商城项目实战10 - 个人中心中间内容设置

1，新建一个MineMiddleView.js，专门用于构建中间的内容 /** * Sample React Native App * https://github.com/facebook/react-native * @flow */import React, { Component } from 'react';import { AppRegistry, Style

2016-08-24 08:55:48 1541

原创 Gulp+webpack模板化开发演练(1):分离公共头文件

分离html模板，抽取公共的模板需要安装插件这是一个webpack加载器，可以把文件原样返回字符串npm install raw-loader --save-dev示例代码 var header = require(“raw!xxx.html”); 就会把html内容读取出来首先创建一个header.html<p>这是头部公共部分</p>这个是给我们login.html来包含的<div

2016-08-23 22:24:45 2220

原创利用gulp自动完成配置"吐"给webpack执行

webpack的入口理论上我们对那些文件”需要成为入口文件“都要有一个基本的规则，目前我们零散的把我们的文件统统放到了src下面，我们先整理一下同时，这些js理，引入的css路径也要修改require('./../../css/index.css');1.下面我们要来试验如何用gulp来读取webpack的配置文件？先把webpack.config.js的入口为空// entry

2016-08-23 20:34:06 4184 1

原创 React Native商城项目实战09 - 个人中心自定义cell

1.新建组件CommonMyCell.js /** * Sample React Native App * https://github.com/facebook/react-native * @flow */import React, { Component } from 'react';import { AppRegistry, StyleSheet, Tex

2016-08-23 15:42:40 1832

原创根据分类id，获取该分类下的商品数据(商品名，价格，路径，缩略图)

$_featCategory= Mage::getModel('catalog/category')->load(400); $_productCollection = Mage::getResourceModel('reports/product_collection') ->addAttributeToSelect('*')

2016-08-23 14:13:58 4558

转载 Magento调用New Arrivals 新品上架产品实例

Magento调用New Arrivals 新品上架产品实例首先：在后台编辑产品里面设置新产品的上线时间和结束时间即可。即设置产品的Set Product as New from Date和Set Product as New to Date 其次：默认最多只能显示最新五个产品，如需要修改显示个数：在app/code

2016-08-23 10:14:07 1693

原创用webpack的CommonsChunkPlugin提取公共代码的3种方式

前面我们实现了多页面分离资源引用,按需引用JS和css 但有一个问题：最后生成的3个js，都有重复代码，我们应该把这部分公共代码单独提取出来。方式一，传入字符串参数 new webpack.optimize.CommonsChunkPlugin(‘common.js’), // 默认会把所有入口节点的公共代码提取出来,生成一个common.jsvar HtmlWebpackP

2016-08-22 21:33:00 52577 1

原创多页面分离资源引用,按需引用JS和css

1.新建./src/tpl/index.html:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <scritp src="http://cdn.bootcss.com/jquery/1.12.4/jquery.js"></scritp></head><

2016-08-22 21:08:06 7369

https://github.com/webpack/extract-text-webpack-plugin 安装：npm install extract-text-webpack-plugin --save-dev1.新建一个css，./src/css/user.css:h2{color: blue}./src/login.js:require('./css/user.css');2.如果就这样

2016-08-22 20:13:59 3199

原创构建登录页面：样式处理初步

1.给login.html模板文件添加外部css样式<button id="loginBtn" class="redBtn">登录</button><button class="greenBtn">注册</button>./src/css/main.css: <button id="loginBtn" class="redBtn">登录</button><button class="greenB

2016-08-22 19:45:38 1304

原创 React Native商城项目实战08 - 设置“More”界面cell

知识点关于cell上的Switch开关自定义可复用的cell More/CommonCell.js:/** * Sample React Native App * https://github.com/facebook/react-native * @flow */import React, { Component } from 'react';import { AppR

2016-08-22 16:39:23 1566 4

原创根据销量排序，获取商品的数据(价格，名称，url，商品图片)

$_productCollection = Mage::getResourceModel('reports/product_collection') ->addAttributeToSelect('*') ->addOrderedQty() ->addAttributeToFilter('visibil

2016-08-22 13:39:15 5951

原创用webpack把我们的业务模块分开打包2

事实上，jquery这样的库我们生产环境肯定要使用CDN,而不会和我们的业务模块打包打一起。比如国内的CDN地址： http://cdn.bootcss.com/jquery/1.12.4/jquery.js externals:{ ‘jquery’:’jQuery’ },1.源模板文件login.html引入jq<!DOCTYPE html><html><head>

2016-08-21 21:20:09 3562

原创用webpack把我们的业务模块分开打包

如何用webpack打包这3个js? 只需修改webpack的配置文件webpack.config.js:// entry是入口文件，可以多个，代表要编译那些js entry:['./src/main.js','./src/login.js','./src/reg.js'],这样就可以全部打包，最终生成./build/js/build.js1，那么如果我们想最后生成不同的文件，该如何做到呢

2016-08-21 20:14:20 20786

原创 React Native商城项目实战07 - 设置“More”界面导航条

1.More/More.js/** * Sample React Native App * https://github.com/facebook/react-native * @flow */import React, { Component } from 'react';import { AppRegistry, StyleSheet, Text, Vi

2016-08-20 21:15:02 1447

原创 React Native商城项目实战06 - 设置安卓中的启动页

1.Mian/目录下新建LaunchImage.js:/** * Sample React Native App * https://github.com/facebook/react-native * @flow */import React, { Component } from 'react';import { AppRegistry, StyleSheet,

2016-08-20 20:44:56 981

原创 React Native商城项目实战05 - 设置首页的导航条

1.Home.js/** * Sample React Native App * https://github.com/facebook/react-native * @flow */import React, { Component } from 'react';import { AppRegistry, StyleSheet, Text, View,

2016-08-20 17:10:08 871

原创 React Native商城项目实战04 - 封装TabNavigator.Item的创建

1.Main.js/** * Sample React Native App * https://github.com/facebook/react-native * @flow */import React, { Component } from 'react';import { AppRegistry, StyleSheet, Text, View,

2016-08-20 15:50:25 3044

原创 React Native商城项目实战03 - 包装Navigator

知识点 Navigator的基本用法回顾前面已经学习过的NavigatorIOS1.在Home目录下新建首页详细页HomeDetail.js/** * Sample React Native App * https://github.com/facebook/react-native * @flow */import React, { Component } from 'react';

2016-08-20 15:14:15 1363 1

原创 React Native商城项目实战02 - 主要框架部分(tabBar)

回顾前面我们已经了解了IOS下这2个组件的用法： React Native常用组件之TabBarIOS和TabBarIOS.Item组件 React Native常用组件之Navigator和NavigatorIOS1.安装插件，cd到项目根目录下执行: npm i react-native-tab-navigator --save 1.1阅读README.md可以了解该模块基本用法 2

2016-08-20 13:06:52 2932 3

原创实战演练:用gulp+webpack构建用户登录(2):简化

实战演练:用gulp+webpack构建用户登录(1)里有一个缺陷：后面页面上的js是我们手工引入的。利用htmlWebpackPlugin简化页面构建初步 1.安装npm i html-webpack-plugin --save-dev2.修改webpack的配置文件 var HtmlWebpackPlugin = require(‘html-webpack-plugin’) plugins

2016-08-19 20:40:34 663

原创实战演练:用gulp+webpack构建用户登录(1)

1.先看目录结构 src目录下是源文件，最终要”编译”到build目录下。 tpl/login.html是登录模板文件，主要代码如下 <h2>用户登录</h2> <p>用户名：</p> <p><input type="text" name="username" id="username" /></p> <p>密码：</p> <p><input type=

2016-08-19 19:37:28 1405

原创 React Native商城项目实战01 - 初始化设置

1.执行命令，生产一个工程$ react-native init BuyDemo2.导入图片资源安卓：把文件夹放到/android/app/src/main/res/目录下，如图： iOS: Xcode打开工程，把图片拖动到Images.xcassets里3.根据实际需求，组织项目结构，目的是更加清晰 4.Main.js/** * Sample React Native App *

2016-08-19 17:05:14 1829 1

原创 magento获取当前站点的所有产品分类列表

/** * 组装菜单数据（递归子菜单） * @param Varien_Data_Tree_Node $node * @return array */function nodeToArray(Varien_Data_Tree_Node $node) { $result = array(); $result['category_id'] = $node->getId();

2016-08-18 17:08:30 1785

原创实战演练:用gulp+EJS像CMS那样生成完整新闻内容面

ejs 安装npm install ejs --save-dev官网：http://wwww.embeddedjs.com 这是一个很经典且使用非常简单的js模板引擎。如果你用过nodejs开发后端，那么ejs应该有所了解。但我们这里只探讨在前端理的使用。一、测试一下 1.随便新建一个ejs.html<!DOCTYPE html><html><head> <title></ti

2016-08-17 21:43:45 2573

原创 header.phtml如何加载购物车的sidebar.phtml

截图（红色标注）是商品详细页面展示的购物车详细：template\checkout\cart\sidebar.phtml。很多时候，我们希望在网站顶部也查看购物车，例如我们希望所有页面都可以查看购物车。1.page.xml找到blocktype="page/html_header",这个block。为了避免和原有的sidebar.phtml冲突，

2016-08-17 17:09:49 526

原创 jQuery和Prototype的兼容性和冲突的解决方法

先加载Prototype，再加载jQuery 各个js库之间的主要冲突在于$的冲突// 方式一 jQuery.noConflict(); jQuery(document).ready(function (){ jQuery("div").hide(); }); // 方式二 jQuery.noConflict(); jQuer

2016-08-17 15:42:24 1465

原创 magento 1.8.1更换前台主题

1.来到\app\design\frontend\base\目录下复制default文件夹，复制到\app\design\frontend\default目录下（注意这里已经有了一个default文件夹，不能同名），所以我们要修改文件名（在base目录下复制的时候，就应该先修改文件夹的名称：比如：yourname）。完成上面步骤，你的\app\design\frontend\defau

2016-08-16 16:13:38 1182

原创新闻客户端07 - 新闻详情页

知识点 WebView第一种： WebView直接加载一个url来展示网页。观察新闻数据，我们发现有一个3g网页的url{ "url_3w": "http://ent.163.com/16/0815/15/BUH64L0J00031H2L.html", "postid": "BUH64L0J00031H2L", "votecount": 49276,

2016-08-16 14:03:35 1383

原创新闻客户端06 - 完善ListView头部视图

1.我们之前已经用scrollView实现了轮播图效果地址1，地址2 因为需要定时器，所以我们要cd到当前项目根目录下安装这个类库：npm i react-timer-mixin --save 2、Component/ScrollImage.jsimport React, { Component } from 'react';import { AppRegistry, St

2016-08-16 11:08:17 915

空空如也

空空如也