Welcome Onboard!
During the next two hours, we're going to learn the foundations of connecting a WeChat Mini Program with an Application Programming Interface (API).
🛠 Action 1: Setting Up & Importing Your Project
- Open and bookmark the WeChat Official Accounts Platform. We will refer to its [Mini Programs Developers Docs] very often.
- Download and install the Integrated Development Environment (IDE) for WeChat: Select "Stable build" and choose Windows 64 or Mac. If you are using Linux, check this open source hack.
- Download the Zip Folder "[200225] Le Wagon COVID-19 Data Tracker" and add it to your Desktop.
- Open WeChat's IDE to setup your first project
- Turn off any VPN. On the home screen, scan the QR code with your personal WeChat. You should read "Scan succesfully". On your mobile, authorize the login. You're in!
- Choose "Mini Program" from the left menu
- Choose "Import Project" from the top tab bar
- In the "Directory" input, choose the folder titled "[200225] Le Wagon COVID-19 Data Tracker"
- In the "AppID" input, if nothing appears, choose "Test Account"
- Press the green "Import" button on the bottom right
🗺 Action 2: Add Navigation to Your Project
- First, let's start by adding code to our
navigateToData
function.
- Check out the
[wx.navigateto](<https://developers.weixin.qq.com/miniprogram/en/dev/api/route/wx.navigateTo.html>)
section of the Docs for helpful hints.
- In the url, remember to add three layers to your path
/pages/data/data
- SHOW JS SOLUTION
- Second, let's add a
bindtap
to our wxml <button>
element.
- Identify the button element in your
/pages/index/index.wxml
- Make sure the value of your bindtap is EXACTLY the same as your function name.
- SHOW WXML SOLUTION