發一個公益志愿者服務招募的小程序,你需要考慮前端、后端、數據庫以及相關的第三方服務集成。以下是一個技術方案的概覽:
圖片來源pixabay
通過以上技術方案,你可以構建一個功能全面、安全可靠、用戶體驗良好的公益志愿者服務招募小程序。在開發過程中,保持與團隊成員的良好溝通,確保項目按時完成并達到預期目標。
深圳智根網絡專注志原者平臺系統開發,歡迎大家與深圳智根網絡小編交流學習!
們都知道,微信小程序已經火了很久了,但是,應該說,現在才是最火的時候吧,畢竟,很早之前,想要寫個小程序Hello World,讓別人看看,你需要企業身份注冊(個體工商戶也可以),限制多,讓很多個人望而卻步。
時至今日(具體日期不再考究),可以個人注冊了,那么就讓我們來寫一個自己的Hello World吧。
第一步:注冊
在微信公眾平臺官網首頁,點擊注冊。(相關文檔可以找到,這里不再累述,望見諒。)
微信小程序注冊成功后界面
第二步:編輯器、開發工具
我們假定你已經申請注冊好微信小程序了,我們選定一個代碼開發的編輯器。
這里,我推薦用:Sublime Text或者 Visual Studio Code。
然后下載微信開發者工具(目前最新版:0.17.172600) 界面如下:
微信開發者工具示意圖
如果你經常用Chrome的話,是不是很類似,Chrome下開啟調試工具(F12),切換到手機模式,調整調試工具的方向到右側貼邊。
第三步:寫代碼
我們用Sublime Text打開一個空目錄,然后新建3個文件:app.js、app.json、app.wxss。
這3個文件是必須的,名字是固定的,app代表的就是這整個小程序,所以,我們從名字上就能看出它們的重要性了。
至于文件擴展名,先說明一下:.wxss表示css,.wxml表示html,.json表示配置信息,這樣,你就知道了,平時我們開發一個網頁的3文件(html、css、js),是被另行規定了一下,你只要記住就行了,這是規則。
1、app.js
微信小程序app.js
這里,我們只寫一個空App({}),這是規定的語法,你也可以到微信小程序開發文檔上看詳細說明。
2、app.json
微信小程序app.json
這里大部分是固定的,你只需要改變配置信息就行,針對本文,你需要指定 hello.js(不帶擴展名)。
3、app.wxss
微信小程序app.wxss
這是全局的css樣式定義,和你之前定義的main.css,讓整個網站都用的公共樣式一樣。
4、hello.js
我們新建一個pages文件夾,讓所有的頁面都在此管理,接著新建hello.js文件,如下:
微信小程序hello.js文件
Page({})這是固定的格式, data也是固定的,表示靜態數據用的,這里,我們定義message變量。
5、hello.wxml
微信小程序hello.wxml文件
這里的view是一個容器,類似我們經常寫的div。然后模板引用數據{{變量}},上個文件,我們定義的變量在這里使用。
6、hello.wxss
微信小程序hello.wxss文件
定義了2個css類樣式,供上一個文件的標簽class屬性使用。
第四步:調試預覽,上傳
把之前安裝的微信開發者工具,打開,創建項目,指定我們的代碼目錄,就可以預覽(需要微信驗證登錄)。這一部分,不細說了,官方的開發文檔上有詳細的說明。
調試預覽的效果,就如上邊編輯器的圖片那樣的。
關于上傳的,微信開發者工具,就可以上傳, 但是,因為本文太簡單,即便上傳了,也不太會審核通過的。
至此,就介紹完這個小程序Hello World了,強烈建議你有空了,細看一下《微信小程序官方開發文檔》。有什么不明白的,可以評論交流。
如果本文對你有點幫助,那么請關注我吧,求關注,求點贊,求轉發!!!
文以一次尋求免費上傳本地Html方法的過程為例,總結從網絡獲取信息的經驗。
最近遇到過這類問題:
我覺得長輩與年輕人解決問題的方法是各有側重的,長輩們擅長通過已有的閱歷和人脈解決問題,而年輕人的優勢在于愿意自己發掘新信息。
也許我們不是為了增長知識,只是想找些樂子,但潛移默化中這種發掘信息的能力也將成為我們的寶貴財富。
本文立足于解決那些與自己專業不對口的、無法一次性搜索到答案的問題,這類問題有以下特征:
達成一個特定目的或許有很多方案,需要做的第一步:
列出這些方案,通過主觀判斷去掉不可行的,深入開展自認為可行的。
事情是這樣的,幾個朋友參加某考試需要背誦大量例題,我想幫他們做一個“單詞卡”式的復習文檔。關鍵功能是可以自由打開或關閉答案,類似在單詞卡的正反面分別記錄單詞與釋義。思考后,我想到了兩個方案:
我很快放棄了第一個方案,考慮到:
而我主觀認為方案2可以很好地彌補這三個缺陷,于是開始落實它。
既然是解決一個全新的問題,我就無法保證能夠按照自己的臆斷來順利完成,但也并非寸步難行。這就是第二步:
尚未超綱則步步為營:按照一般邏輯把能做的先做了。
我完成了以下步驟:
我遇到了第一道坎:通過微信發送完動態的文本后,接收者無法在iOS上打開文件。嘗試處理:
我意識到這類本地Html無法直接使用,必須讓它能被手機瀏覽器打開,那就得把它上傳到網上
網上搜索到的經常會看不懂,需要做到第三步:
亂而不明則兼收并蓄:收集并總結有用的信息,適當地延伸。
通過Google和百度,我檢索了“怎么把本地的Html上傳到網上”,檢索結果包括:
以上三個我都沒有辦法直接使用,我看不懂、買不起、做不來。但這三類信息有一些共性,我提取出了關鍵信息:購買服務器,通過FTP上傳。
我考慮是否可以有免費的方法,于是想到通過微信小程序上傳,相當于借助騰訊的服務器。
我完成了以下步驟:
問題來了:項目中的index.html無法用于小程序開發工具。嘗試處理:
我想我得放棄走小程序這條路了,上述問題可以解決,但我一個外行干不來,盯著這條路只會越走越遠。
在第一次檢索到的信息和延伸出的方法失效后,已經沒有明確的檢索目標了。這是需要想出新方法才能繼續有東西檢索,所以第四步:
無跡可尋則創造痕跡:結合目的與經驗,思考可行的新方法,讓自己有信息可查。
這次該干什么?以前碼字時我有過搭建個人博客網站的念頭,是否可以搭建個人博客然后上傳本地Html。這非常可行,因為我知道可以利用一個叫Hexo的平臺搭建個人博客然后關聯到GitHub倉庫,利用它的服務器來免費上傳。這是一個兩步走的方法:
根據知乎上的Hexo個人博客搭建教程,我成功本地建站、關聯GitHub、提交配置和Html。我將域名發給朋友們,完成了此次分享。
其實以上所述是我完成這件事的幾個大節點,是保證探索方向正確的關鍵,但過程中的很多細節處理遠稱不上順利,但這也讓我收獲了一些技巧和理念。這些收獲對處理網絡信息有很大幫助。
從小到大,電腦遇到了問題,我使用得最多的解決方法就是重啟,也許一些問題只需要略加操作即可解決,但我不懂,只有通過重啟來避免排查問題。我也試過排查問題,但在時間成本方面,重啟是最經濟的做法。
做專業不對口的事情,排查問題、弄清原理是非常耗時的;如果只需要達成當前的特定目標,照葫蘆畫瓢地遍歷每個步驟反而是最高效的
在搭建博客時,本地建站需要新建空文件夾、安裝Hexo、啟動插件、清空、配置等等各種各樣的步驟,稍微錯一步就會報錯,我大概有一個小時都陷在了“打不開本地博客”的問題里。一開始我是檢查終端命令行,哪一步有問題我就修改,但始終差一點。
后來,經過多次從第一步到最后一步的完整操作,建站成功。我已經不關心之前報錯是什么原因了,成功就行。
我在網上檢索時會帶著浮躁心態,搜索引擎推薦給我各個網站,我一一瀏覽過去,看不到想要的就退回去,繼續下一個網站。這種“泛檢索”完全浪費了網站“物以類聚”的特性。一些專門性的網站的站內聯想推薦往往比大型搜索引擎的推薦要更精準。
遇到解答不了自己疑惑的文章,往下翻一翻,在同一個網站內深度挖掘。畢竟這一整個網站都是沖這門學科來的。
在提交本地Html時,我發現Hexo只能展示Markdown文本,因為它只是個博客平臺,文本才是主要內容。我搜索了“怎么在Hexo顯示本地Html”,搜索結果非常少。
我選擇了CSDN網站的鏈接,上面是一位專業人員分享的解決類似問題的方法。但由于它是專業的,很多步驟跳過了,我沒有辦法完全照做。于是我繼續往下翻,發現有大量同行分享了各自的方法,通過不斷點擊網站推薦的帖子,我最終整理出了完整的提交流程。
最后一步卡住了我好久,我已經新建了“about”文件夾,成功提交了Html,但是打開個人博客時還是不顯示頁面鏈接。CSDN上的帖子已經翻得差不多了,沒有一個講了怎么跳轉到“about”,好像他們提交完就可以直接顯示了。
對于外行來說,靈光乍現真是一棵救命稻草,我在個人博客的域名后添加了“/about”,回車,成功跳轉。
要是網上的信息實在幫不了忙,不如利用常識放手一試,也許很蠢,也許很成功。
這件事情解決的完美嗎?我不知道。有更高效的上傳方案嗎?我不知道。如果不是自己在網上搜,而是直接問程序員朋友,會更省事嗎?我也不知道。
說不定過一陣子,我和哪個朋友聊起這件事,他一語道破我把這件事做得太復雜,完全可以換一種思路輕松完成,到時候我會訕笑一聲,自嘲好傻。
但終歸我會了“免于購買服務器和域名而直接上傳自己的本地頁面”這件事。
*請認真填寫需求信息,我們會在24小時內與您取得聯系。