ant-design學習準備_1

来源:https://www.cnblogs.com/wanggang2016/archive/2018/11/04/9905733.html
-Advertisement-
Play Games

在學習ant-desin過程中,發現很多知識都不清楚,從現在開始,每天將自己學習到的知識進行一個總結記錄,前端大佬勿擾勿噴。先介紹幾個基礎概念和一些常用命令: 1、什麼是腳手架 我們經常在各個博客論壇下看到腳手架這個名詞,那什麼是腳手架呢。看到很多前輩們的說法之後,腳手架就相當於預定義的一套模板環境 ...


      在學習ant-desin過程中,發現很多知識都不清楚,從現在開始,每天將自己學習到的知識進行一個總結記錄,前端大佬勿擾勿噴。先介紹幾個基礎概念和一些常用命令:

1、什麼是腳手架

     我們經常在各個博客論壇下看到腳手架這個名詞,那什麼是腳手架呢。看到很多前輩們的說法之後,腳手架就相當於預定義的一套模板環境,後續的項目開發可以直接應用這套環境,不用再重覆的去搭建。

腳手架”是一種元編程的方法,用於構建基於資料庫的應用。許多MVC框架都有運用這種思想。
程式員編寫一份specification(規格說明書),來描述怎樣去使用資料庫;而由(腳手架的)編譯器來根據這份specification生成相應的代碼,進行增、刪、改、查資料庫的操作。我們把這種模式稱為"腳手架",在腳手架上面去更高效的建造出強大的應用!

    腳手架的作用.:腳手架就可以幫你減少這些 為減少重覆性工作而做的重覆性工作. 腳手架一個命令,目錄結構、gulp腳本、babel配置、空的測試文件都幫你搞好了. 直接寫核心業務代碼,不做重覆性工作。

2、什麼是npm

     npm,顧名思義:npm(node package manager)node的包管理工具。也就是在伺服器上搭建了一個共用文件管理中心,可以通過npm命令直接獲取文件。

npm 的發展是跟 Node.js 的發展相輔相成的。
Node.js 是由一個在德國工作的美國程式員 Ryan Dahl 寫的。他寫了 Node.js,但是 Node.js 缺少一個包管理器,於是他和 npm 的作者一拍即合、抱團取暖,最終 Node.js 內置了 npm。
後來的事情大家都知道,Node.js 火了。
隨著 Node.js 的火爆,大家開始用 npm 來共用 JS 代碼了,於是 jQuery 作者也將 jQuery 發佈到 npm 了。
所以現在,你可以使用 npm install jquery 來下載 jQuery 代碼。
現在用 npm 來分享代碼已經成了前端的標配。

3、現在找一個腳手架地址,進行一些常用命令練習:

ant-design腳手架市場:http://scaffold.ant.design/#/;找到某款腳手架github地址:https://github.com/yezihaohao/react-admin,我們先獲取代碼內容,直接通過git clone獲取(要使用git 必須配置安裝git並配置環境變數,請自行百度git下載安裝):

cmd定位到代碼想放置的一個目錄:(這裡我放置目錄為:E:\Projects\antdesign)

①執行命令:git clone --depth=1 https://github.com/yezihaohao/react-admin.git react_admin

最後的名字自己隨便取,執行完之後會在當前目錄下創建react_admin文件夾,代碼就全部獲取在了該目錄下:

②、cmd執行命令:cd react_admin

③安裝該腳手架的環境依賴,這裡依舊通過命令行安裝:

cmd 執行:npm install

(註:npm需要自行搭建環境,這裡我是直接安裝NodeJs,nodejs前端也是必須要學習瞭解的,其中集成了npm,建議直接安裝nodejs即可。這裡我使用的是node-v10.13.0-x64.msi)

開始獲取所依賴的文件了,這裡需要等待一段時間,大概幾分鐘時間就可以了

④依賴環境安裝完了之後,可以運行起來看一下腳手架的內容了。

cmd命令:npm start

打開了一個新的cmd視窗:

可以看到在瀏覽器中:

 

 ⑤如果項目需要發佈的話,可以打包項目:

cmd命令:npm run build

 編譯出來的js/css 文件應該是可以直接用於項目中了。


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 2018-11-04 19:35:12 開始寫 刷新後就可以看見導入的資料庫了(按F5刷新) 謝謝、Thank you、Salamat Do(撒拉瑪特朵)、あリがCám o*n(嘉蒙)とゥ(阿裡嘎都)、감사합니다 (勘三哈咪瘩)、terima Kasih(得力馬卡系)、kob-khun(寇布庫恩)、 ...
  • 資料庫 1. 資料庫伺服器:運行資料庫管理軟體的電腦 2. 資料庫管理軟體:mysql,oracle,db2,sqlserver 3. 庫:文件夾 4. 表:文件 5. 記錄:食物一系列典型的特征 6. 數據:描述事物特征的符號 資料庫的分類: 關係型:sqllite,db2,oracle,acc ...
  • 一. 概述 字典又稱符號表(symbol table),關聯數組(associative array), 映射(map),是一種用於保存鍵值對(key-value pair)的抽象數據結構。在字典中,一個key和一個value進行關聯稱為鍵值對。在字典中每個鍵都是唯一的,程式可以在字典中根據鍵查找關 ...
  • 有很多學習大數據的朋友,在初期學習時,通常會對如何學習而感到迷茫。我經常收到零基礎的朋友關於如何入門、如何規劃學習大數據、大數據的學習流程是什麼的一些問題。今天我就粗淺的總結幾點學習大數據方法。 一、興趣建立 興趣是可以讓一個人持續關註一個事物的核心動力,那麼興趣的培養就非常重要了。如果你把寫程式單 ...
  • 1、CONCAT(str1,str2,...) 返回來自於參數連結的字元串。如果任何參數是NULL,返回NULL。可以有超過2個的參數。一個數字參數被變換為等價的字元串形式。 select CONCAT('My', 'S', 'QL');--'MySQL' select CONCAT('My', N ...
  • 一.概述 在sql server里臨時表存儲在TempDB庫中,TempDB是一個系統資料庫,它只有Simple恢復模式,也是最小日誌記錄操作。主要用於存放局部臨時表,全局臨時表,表變數,都是基於臨時特征,每次伺服器或服務重啟後,都會按照Model庫的配置重新創建TempDB庫。在sql serve ...
  • https://www.bilibili.com/video/av27255821/ ...
  • 轉載請註明出處:https://www.cnblogs.com/Joanna-Yan/p/9896180.html 需求:設備傳回伺服器的軌跡點,需要在web地圖上顯示。包括畫坐標點覆蓋物、軌跡路線圖。當數據量達到一定量時,界面出現卡頓。問題出現幾天前端人員都未解決。 第一反應,大量的覆蓋物肯定不能 ...
一周排行
    -Advertisement-
    Play Games
  • 示例項目結構 在 Visual Studio 中創建一個 WinForms 應用程式後,項目結構如下所示: MyWinFormsApp/ │ ├───Properties/ │ └───Settings.settings │ ├───bin/ │ ├───Debug/ │ └───Release/ ...
  • [STAThread] 特性用於需要與 COM 組件交互的應用程式,尤其是依賴單線程模型(如 Windows Forms 應用程式)的組件。在 STA 模式下,線程擁有自己的消息迴圈,這對於處理用戶界面和某些 COM 組件是必要的。 [STAThread] static void Main(stri ...
  • 在WinForm中使用全局異常捕獲處理 在WinForm應用程式中,全局異常捕獲是確保程式穩定性的關鍵。通過在Program類的Main方法中設置全局異常處理,可以有效地捕獲並處理未預見的異常,從而避免程式崩潰。 註冊全局異常事件 [STAThread] static void Main() { / ...
  • 前言 給大家推薦一款開源的 Winform 控制項庫,可以幫助我們開發更加美觀、漂亮的 WinForm 界面。 項目介紹 SunnyUI.NET 是一個基於 .NET Framework 4.0+、.NET 6、.NET 7 和 .NET 8 的 WinForm 開源控制項庫,同時也提供了工具類庫、擴展 ...
  • 說明 該文章是屬於OverallAuth2.0系列文章,每周更新一篇該系列文章(從0到1完成系統開發)。 該系統文章,我會儘量說的非常詳細,做到不管新手、老手都能看懂。 說明:OverallAuth2.0 是一個簡單、易懂、功能強大的許可權+可視化流程管理系統。 有興趣的朋友,請關註我吧(*^▽^*) ...
  • 一、下載安裝 1.下載git 必須先下載並安裝git,再TortoiseGit下載安裝 git安裝參考教程:https://blog.csdn.net/mukes/article/details/115693833 2.TortoiseGit下載與安裝 TortoiseGit,Git客戶端,32/6 ...
  • 前言 在項目開發過程中,理解數據結構和演算法如同掌握蓋房子的秘訣。演算法不僅能幫助我們編寫高效、優質的代碼,還能解決項目中遇到的各種難題。 給大家推薦一個支持C#的開源免費、新手友好的數據結構與演算法入門教程:Hello演算法。 項目介紹 《Hello Algo》是一本開源免費、新手友好的數據結構與演算法入門 ...
  • 1.生成單個Proto.bat內容 @rem Copyright 2016, Google Inc. @rem All rights reserved. @rem @rem Redistribution and use in source and binary forms, with or with ...
  • 一:背景 1. 講故事 前段時間有位朋友找到我,說他的窗體程式在客戶這邊出現了卡死,讓我幫忙看下怎麼回事?dump也生成了,既然有dump了那就上 windbg 分析吧。 二:WinDbg 分析 1. 為什麼會卡死 窗體程式的卡死,入口門檻很低,後續往下分析就不一定了,不管怎麼說先用 !clrsta ...
  • 前言 人工智慧時代,人臉識別技術已成為安全驗證、身份識別和用戶交互的關鍵工具。 給大家推薦一款.NET 開源提供了強大的人臉識別 API,工具不僅易於集成,還具備高效處理能力。 本文將介紹一款如何利用這些API,為我們的項目添加智能識別的亮點。 項目介紹 GitHub 上擁有 1.2k 星標的 C# ...