Pokedex
Overview
Documentation
Description
For those who love to know how to use React in mendix. The source code demonstrate how it can handle API call via axios and render within the widget
Typical usage scenario
Display the list of pokemon from pokedex api. Including category and search.
Features and limitations
Features:
- List of Pokemons
- Categories of Pokemons
- Details and type of each pokemons
Limitations:
- Render within a page which contain atlas top bar layout
Dependencies
- Mendix 9.4
Installation
1- place the widget on Home_Web
2- run local and start to enjoy
Configuration
- Note: in case you want to build the widget again github (make sure that pluggable widget tools is version 8.18.3
you need to add these line into /node_modules/@mendix/pluggable-widgets-tools/configs/webpack.config.dev.js
{
test: /\.(js|jsx)$/,
exclude: /(node_modules)/,
loader: 'babel-loader',
options: {
presets: [
'@babel/preset-env',
'@babel/react',
{
plugins: ['@babel/plugin-proposal-class-properties'
, '@babel/plugin-transform-runtime'
],
},
],
},
},
{test:/.(png | jpg | gif | svg)$/, use:['url-loader?limit=8192&name=./[name].[ext]']},
{test: /\.(jpe?g|png|gif|svg)$/i, loader: "file-loader?name=app/images/[name].[ext]"},
Then add these line into /node_modules/@mendix/pluggable-widgets-tools/configs/webpack.config.common.js
{test:/.(png | jpg | gif | svg)$/, use:['url-loader?limit=8192&name=./[name].[ext]']},
{test: /\.(jpe?g|png|gif|svg)$/i, loader: "file-loader?name=app/images/[name].[ext]"},
Bugs
None