All Projects → eidonlon → Imitate One

eidonlon / Imitate One

用vue+webpack + node仿制的One[一个 ]app

Programming Languages

javascript
184084 projects - #8 most used programming language

Projects that are alternatives of or similar to Imitate One

Vue Fullstack
vue fullstack template
Stars: ✭ 297 (+37.5%)
Mutual labels:  express, vue2, vue-resource
Github Ranking
🔍GitHub不同语言热门项目排行,Vue.js做页面展示
Stars: ✭ 160 (-25.93%)
Mutual labels:  webpack, express, vue2
Vue2 blog
使用vue2.x + vue-cli +vue-router+ vuex + axios + mysql + express + pm2 + webpack+nginx构建的具有登录,注册,留言,用户发帖,用户评论等功能的SPA Blog。注意,注意,注意,后端API全部自己手写,很适合刚学习vue以及express的小伙伴学习,喜欢请Star鼓励一下我,谢谢!项目预览:
Stars: ✭ 417 (+93.06%)
Mutual labels:  webpack, express, vue2
Myblog
vue + node 实现的一个博客系统
Stars: ✭ 285 (+31.94%)
Mutual labels:  webpack, express, vue-resource
Easy Vue
Learn vueJS Easily 👻
Stars: ✭ 896 (+314.81%)
Mutual labels:  webpack, vue2, vue-resource
Vue Awesome Swiper
🏆 Swiper component for @vuejs
Stars: ✭ 12,072 (+5488.89%)
Mutual labels:  vue2, vue-resource
Express Webpack React Redux Typescript Boilerplate
🎉 A full-stack boilerplate that using express with webpack, react and typescirpt!
Stars: ✭ 156 (-27.78%)
Mutual labels:  webpack, express
Vue Codemirror
⌨️ @codemirror component for @vuejs
Stars: ✭ 2,115 (+879.17%)
Mutual labels:  vue2, vue-resource
Ts App
Boilerplate project for a TypeScript API (Express, tsoa) + UI (React/TSX)
Stars: ✭ 182 (-15.74%)
Mutual labels:  webpack, express
163music
🎵163 music web app built with Vue 2.6, server side render, webpack 4
Stars: ✭ 139 (-35.65%)
Mutual labels:  express, vue2
Ecommerce Site Template
A beautiful e-commerce template powered by React, Redux and other modern web tech.
Stars: ✭ 167 (-22.69%)
Mutual labels:  webpack, express
Blog
大前端技术为主,读书笔记、随笔、理财为辅,做个终身学习者。
Stars: ✭ 3,179 (+1371.76%)
Mutual labels:  webpack, express
Js Stack Boilerplate
Final boilerplate code of the JavaScript Stack from Scratch tutorial –
Stars: ✭ 145 (-32.87%)
Mutual labels:  webpack, express
Vue Cli Multi Page
基于vue-cli模板的多页面多路由项目,一个PC端页面入口,一个移动端页面入口,且有各自的路由, vue+webpack+vue-router+vuex+mock+axios
Stars: ✭ 145 (-32.87%)
Mutual labels:  webpack, vue2
Avvw
Apicloud + Vue2 + Vant(有赞前端)+ Webpack4打包,极速开发APP框架,将apicloud的渲染效率和vue数据绑定特性发挥极致!
Stars: ✭ 143 (-33.8%)
Mutual labels:  webpack, vue2
Vue2 Demo
Vue 基于 Genesis + TS + Vuex 实现的 SSR demo
Stars: ✭ 2,072 (+859.26%)
Mutual labels:  webpack, vue2
Vue Node Pastime
😄 基于vue全家桶、nodejs和mongodb的前后端整合项目
Stars: ✭ 200 (-7.41%)
Mutual labels:  express, vue2
Feathers Vue
A boiler plate template using Feathers with Email Verification, Vue 2 with Server Side Rendering, stylus, scss, jade, babel, webpack, ES 6-8, login form, user authorization, and SEO
Stars: ✭ 195 (-9.72%)
Mutual labels:  webpack, express
Mern Boilerplate
MERN stack project boilerplate
Stars: ✭ 211 (-2.31%)
Mutual labels:  webpack, express
Vue2.0 Multi Page
基于vue-cli(vue2.X,webpack1.X,es6,sass环境)多页面开发
Stars: ✭ 206 (-4.63%)
Mutual labels:  webpack, vue2

imitate ONE

简介:这是一个使用vue仿的[ONE.一个]app,纯粹学习而已。

声明 更新于2018-10-14。

这基本是一个过期的demo了,因为原本所用到的技术都更新了,所以请参考我隔壁的最新demo.

用到的技术

vue2 + vue-router + vue-resource + webpack + express + Node爬虫

后台接口数据

​用express 搭建的后台,除了图文、阅读、音乐页面的列表是读取的本地json文件外,首页以及其他详情数据都是用爬虫爬取得[ONE.一个]网站的数据[注:这里爬取数据只是一个练习,练习而已,并没有非法使用爬来的数据呀 :scared: ]。

关于爬虫

这里只是一个非常简单的爬虫,用的是Node HTTP API的get方法,获取到要爬取的页面,然后使用cheerio 进行解析处理获得想要的数据。

运行项目

#先克隆项目
git clone https://github.com/eidonlon/imitate-One.git

#进入文件夹
cd imitate-One

#安装依赖
npm install

#运行
npm run dev

#然后浏览器会自动打开页面,请在chrome下调成手机模式预览
#另,项目打包[此处只打包了前端的代码,后台并没有一起被打包]
npm run build 

效果演示

线上效果请戳这里;(请在chrome下调成手机模式预览)

移动端扫描下方二维码

二维码

部分截图

首页

home

菜单

menu

音乐

music

阅读

read

都看到这里,给个star 吧。

Build Setup

# install dependencies
npm install

# serve with hot reload at localhost:8080
npm run dev

# build for production with minification
npm run build

# build for production and view the bundle analyzer report
npm run build --report

# run unit tests
npm run unit

# run e2e tests
npm run e2e

# run all tests
npm test

For detailed explanation on how things work, checkout the guide and docs for vue-loader.

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].