ESP8266 Huab Cua Chaw Nres Tsheb uas Qhia Cov Ntaub Ntawv ntawm Lub Vev Xaib: 7 Kauj Ruam

2024 Tus sau: John Day | [email protected]. Kawg hloov kho: 2024-01-30 09:27

Nco tseg: Ib feem ntawm qhov kev qhia no yuav muaj nyob hauv cov vis dis aus ntawm kuv li YouTube Channel - Tech Tribe

Hauv cov lus qhia no, kuv yuav qhia yuav ua li cas thiaj ua lub chaw nres tsheb huab cua uas ncaj qha xa cov ntaub ntawv rau koj lub vev xaib. Yog li, koj yuav xav tau koj tus kheej sau (Ex: msolonko.net). Txhawm rau pib, ntawm no yog cov ntaub ntawv koj yuav xav tau:

Yam khoom:

Plaub Huzzah ($ 16.95)

Micro USB cable nrog Cov Ntaub Ntawv ($ 1.99)

Cov Roj Teeb ($ 25): Kuv mam li tham tom qab ntawd lub peev xwm uas koj xav tau rau lub sijhawm twg yam tsis tau them nyiaj rov qab, yog li koj tuaj yeem xaiv lub peev xwm uas koj xav tau. Nov yog qhov txuas rau qhov kuv tau siv. Koj tseem tuaj yeem siv lub zog los ntawm lub qhov hluav taws xob.

1 Tus kws yees duab

Qee qhov lwm tus tiv thaiv - tham tom qab

Hlau

Perf Board ($ 5.59) - Pob ntawm 20

BME280 Kub, Siab, thiab Vaum Sensor ($ 9.99)

Qee lub thawv; koj tuaj yeem luam 3D ib qho, thiab kuv yuav qhia koj qhov kev tsim.

Webhosting thiab sau, yog tias koj xav ua raws nrog kev qhia ua tiav

Cov Cuab Yeej:

Hlau txiav

Soldering hlau

Kauj Ruam 1: Feather Huzzah Code

Cov cai yuav raug sau hauv Arduino IDE, uas tuaj yeem rub tawm ntawm no. Ua ntej peb pib, thov ua raws cov lus qhia ntawm no txhawm rau teeb tsa Arduino IDE los ua haujlwm nrog koj Feather Huzzah. Tsis tas li, ua raws cov lus qhia no txhawm rau rub tawm lub tsev qiv ntawv tsim nyog kom tau txais BME sensor ua haujlwm. Qhov ntaub ntawv txuas nrog, thiab txhua txoj cai tau tawm tswv yim kom koj nkag siab nws. Thaum koj saib nws, txav mus rau theem tom ntej uas peb yuav saib cov cai uas tau txais cov ntaub ntawv ntsuas.

Kauj Ruam 2: Tau Txais Cov Ntaub Ntawv Los Ntawm Feather Huzzah

Txog tam sim no, koj vam tias nkag siab tias Arduino code ua haujlwm li cas. Yog tsis yog, rov qab mus rau txoj cai thiab nyeem kuv cov lus (Kuv tau hais tawm yuav luag txhua kab). Tam sim no peb yuav sau cov cai uas tau txais cov ntaub ntawv. Zoo li ua ntej, txhua yam nws tau tawm tswv yim. Cov lus programming uas siv rau qhov no yog PHP, uas koj tuaj yeem nyeem ntxiv txog ntawm no.

Peb cov ntaub ntawv yuav raug khaws cia hauv MySQL Database, uas koj tuaj yeem nyeem ntxiv txog ntawm no. Cov ntaub ntawv khaws cia hauv cov ntxhuav uas muaj kab thiab kab. Ua ntej peb sau cov cai, peb yuav tsum ua tus qauv ntawm peb lub rooj ntawm peb tus tswv cPanel. Kuv tab tom siv Arvixe Hosting, yog li koj li cPanel yuav zoo li txawv. Xa mus rau ib qho ntawm cov duab kom pom tias ib feem ntawm kuv zoo li cas. Ua ntej, koj xav tsim MySQL database tshiab yog tias koj tsis muaj ib qho lawm. Koj tuaj yeem siv tus wizard rau qhov ntawd. Muaj ntau ntawm cov peev txheej online ntawm no yog tias koj xav tau kev pab.

Thaum koj muaj cov ntaub ntawv teeb tsa, mus rau phpMyAdmin thiab xaiv koj li database. Tsim lub rooj npe hu ua weather_data nrog 9 kab. Tham nrog ib qho ntawm kuv cov duab saum toj no kom pom dab tsi txhua kab ntawv yuav tsum yog (theej lub npe, hom ntaub ntawv, thiab txhua yam ntxiv raws nraim yog tias koj xav siv kuv tus lej). Lub txee yuav yog peb tus yuam sij tseem ceeb thiab tus lej yuav pab peb txheeb xyuas hnub twg cov ntaub ntawv cuam tshuam txog (1: hnub no, 2: nag hmo, 3: txhua yam ntxiv). Txij li thaum peb yuav muaj cov ntaub ntawv ntau, peb yuav tshem qee yam ntawm nws thaum nws dhau los. Tias yog vim li cas peb xav tau kab id. Tus so ntawm kab ntawv yog piav qhia tus kheej zoo nkauj. Tam sim no, koj lub rooj hauv koj lub database yuav tsum zoo ib yam li kuv li.

Tam sim no, rub cov kab ntawv txuas thiab nyeem nws thiab kuv cov lus pom. Thaum ua tiav, txav mus rau kauj ruam tom ntej.

Nco tseg: thaum koj rub tawm cov cai, hloov nws mus rau esp.php. Vim qee qhov, kuv tau txais qhov yuam kev thaum kuv sim xa cov ntaub ntawv PHP.

Qhov no yog qhov yuav ua li cas txoj cai yuav ua haujlwm.

1. Sau cov ntaub ntawv txhua 10 feeb thiab tso saib

2. Ib hnub dhau los, nruab nrab txhua txhua 6 qhov tseem ceeb (kom txuag tau qhov chaw DB) kom muaj cov ntaub ntawv taw qhia rau txhua teev

3. Ib hnub dhau ib hnub, nruab nrab tag nrho cov ntaub ntawv tseem tshuav rau hnub ntawd thiab khaws nws tsuas yog ib qho ntsiab lus xwb

Txoj kev no, peb yuav tuaj yeem pom qhov hloov pauv ntawm lub teeb, qhov kub thiab lwm yam nyob rau lub sijhawm ntawm lub hlis yam tsis tau pib cuam tshuam los ntawm kev hloov pauv niaj hnub hauv qhov kub thiab txias, thiab lwm yam.

Kauj Ruam 3: Rov Muab Cov Ntaub Ntawv Los Ntawm Database los Zaub

Yog li tam sim no peb tau txiav txim siab yuav ua li cas khaws cov ntaub ntawv huab cua thiab xa nws mus rau peb lub database. Tam sim no peb yuav tsum tuaj yeem khaws nws hauv daim ntawv siv tau. Raws li ua ntej, kuv txuas cov ntaub ntawv PHP getWeatherData.txt uas koj yuav tsum khaws rau koj tus tswv tsev thiab hloov pauv cov ntaub ntawv npe mus rau.php hloov ntawm.txt. Tag nrho cov cai tau tawm tswv yim. Nyeem los ntawm nws kom nkag siab nws thiab txav mus ntxiv thaum koj xav tias koj tau txais nws. Yog tias koj muaj lus nug, thov hu rau hauv qab no.

Kauj Ruam 4: Teeb Lub Tsev Qiv Ntawv thiab Qee Yam Ntxiv

Txog qhov haujlwm no, ib qho ntawm cov txheej txheem uas peb yuav siv yog AngularJS, uas yuav pab peb sib txuas lus nrog cov ntaub ntawv thiab tsim SPA (Ib Nplooj Ntawv Thov). Txhawm rau kom tau txais lub tsev qiv ntawv, mus rau qhov txuas no thiab rub tawm version 1.64 lossis siab dua. Txog qhov kev qhia no, Kuv siv 1.64 tab sis cov hloov tshiab tshiab feem ntau raug tso tawm yog li koj tuaj yeem siv qhov sib txawv. Nrhiav qhov txuas ntawm nplooj ntawv uas xaus zoo li no: /VERSION/angular.min.js

Luam qhov txuas thiab khaws nws qhov chaw nyab xeeb. Peb nyuam qhuav tau txais qhov txuas rau AngularJS lub tsev qiv ntawv. Koj yuav xav tau nws rau qib tom ntej. Tam sim no, ntawm tib nplooj ntawv pom qhov txuas uas zoo li qhov no thiab luam nws ib yam: /VERSION/angular-route.min.js

Txoj hauv kev yuav pab peb tswj hwm peb SPA thiab daws qhov kev hloov pauv ntawm kev pom hauv nplooj ntawv.

Peb xav kom muaj peev xwm ua kom pom cov duab kab ntawm peb cov ntaub ntawv. Rau qhov no peb yuav siv lub tsev qiv ntawv hu ua ChartJS. Mus ntawm no, xaiv qhov hloov tshiab kawg thiab khaws qhov txuas uas xaus zoo li no: VERSION/Chart.bundle.min.js

Thaum kawg, peb yuav siv lub tsev qiv ntawv los teeb tsa nplooj ntawv hu ua Bootstrap. Mus rau qhov txuas rau Kev Pib sai thiab tawm qhov no qhib rau tam sim no. Thaum peb pib sau tus lej tus neeg siv khoom, koj yuav tuaj yeem hloov kuv li qub txuas nrog cov ntawv tshiab.

Tam sim no, peb yuav tsum teeb tsa qhov kev xav sib txawv rau peb daim ntawv thov. Hauv cov npe ntawm koj tus tswv tsev uas koj muaj ob daim ntawv dhau los (esp.php thiab getWeatherData.php), tsim cov ntawv tais ceev tseg tshiab hu ua weather_views. Hauv qhov no, peb yuav tso tag nrho peb cov nplooj ntawv uas yuav sib xws nrog tus lej los ntawm peb cov ntaub ntawv khaws tseg (1, 2, lossis 3).

Hauv daim nplaub tshev, tsim 3 cov ntaub ntawv (hnub.html, qub.html, thiab nag hmo.html). Rub tawm cov kab ntawv txuas thiab muab tso rau hauv cov ntawv ntawd. Cov cai rau DAY. HTML tau tawm tswv yim kom koj tuaj yeem nkag siab tias muaj dab tsi tshwm sim. Cov cai rau lwm 2 nplooj ntawv yog qhov zoo ib yam (qhov sib txawv hauv qub.html tau hais tawm).

Thaum koj ua tiav nrog cov kauj ruam no, txav mus rau qhov tom ntej, uas yog cov txheej txheem nyuaj tshaj plaws.

Kauj ruam 5: Main HTML File

Hauv theem no, koj yuav ua/kho/nyeem cov ntawv HTML tseem ceeb uas koj yuav tso saib txhua yam. Txuag cov ntawv txuas (uas, ib txwm, tau tawm tswv yim) raws li espdata.html hauv cov npe tib yam li esp.php. Kuv vam tias koj tuaj yeem hloov qee yam rau nws thiab nkag siab tias yog dab tsi tiag tiag.

Nov yog qhov ntau ntawm koj cov cai, yog li nws yog qhov tseem ceeb kom nkag siab tias yog dab tsi mus.

Kauj Ruam 6: Kev Xeem Hluav Taws Xob ntawm Breadboard

Tam sim no peb yuav sim tias txhua txoj cai ua haujlwm nrog peb cov kho vajtse. Yog tias koj tsis tau ua dua, cov kab laug sab laug rau ntawm Feather Huzzah thiab BME280 sensor. Rau txhua kauj ruam, daim duab tau txuas nrog.

1. Muab plaub rau ntawm daim ntawv tais. Txuas 3V rau + kev tsheb nqaj hlau thiab GND rau - tsheb nqaj hlau.

2. Txuas lub sensor VIN rau + tsheb nqaj hlau thiab GND rau - tsheb nqaj hlau.

3. Txuas sensor SDA rau tus pin 4 ntawm plaub. Txuas SCL rau tus pin 5.

4. Muab tus photoresistor tso rau ntawm lub khob cij nrog ib tus coj mus rau + txoj kev tsheb nqaj hlau.

5. Txuas lub 4.7k resistor mus rau cov hlau lead uas tsis txuas nrog ntawm lub photoresistor. Txuas cov hlau lead uas tsis txuas nrog ntawm 4.7k rau 2k resistor. Txuas qhov txuas tsis txuas ntawm 2k tus tiv thaiv mus rau - tsheb nqaj hlau (GND).

6. Txuas qhov sib txuas ntawm 4.7k thiab 2k resistor rau tus pin ADC (analog pin). Peb nyuam qhuav ua qhov faib hluav taws xob uas faib qhov siab tshaj plaws nyeem los ntawm tus pin los ntawm 3.3V rau tsawg dua 1V. Koj tuaj yeem ua si ib puag ncig nrog koj tus kheej ua ke yog tias koj xav tau tab sis nco ntsoov tias qhov hluav taws xob muab rau tus pin analog yuav tsum tsawg dua 1V.

7. Thaum kawg, txuas RST (rov pib dua) tus pin ntawm cov plaub rau tus pin 16 ntawm cov plaub hau (txiv kab ntxwv xaim hauv daim duab). Qhov teeb tsa no tso cai rau Feather Huzzah nkag mus pw tsaug zog kom txuag lub zog.

Tam sim no koj ua tiav! Tshaj tawm cov cai rau koj cov plaub hau huzzah, thiab cia siab tias, koj tuaj yeem pom koj lub vev xaib hloov tshiab (tsuas yog hnub.html nplooj ntawv). Yog tias tsis yog, sim siv Serial monitor los daws teeb meem lossis nug hauv cov lus hauv qab no.

Kauj Ruam 7: Txoj Haujlwm Nyob Mus Ib Txhis (Tsis teb los tau)

Xav tias txhua yam ua haujlwm, yog tias koj xav tau, koj tuaj yeem ua txoj haujlwm no ruaj khov dua. Kuv yuav tsis qhia qhov no ntawm no, tab sis koj tuaj yeem muab tag nrho cov khoom sib dhos rau hauv lub rooj tsav tsheb thiab tom qab ntawd muab ntim rau hauv lub thawv. Kuv yuav muab cov ntaub ntawv IPT rau 3D ntim uas kuv siv hauv qab no thiab ob peb daim duab kom koj pib. Lub ntim yog lub ntsiab lus rau kev tshoov siab vim tias koj yuav zaum xav ua nws tus kheej ntau dua nrog kev tsim qauv thiab ntawv sib txawv. Muaj kev lom zem nrog customization! Hmoov zoo!