Small YesAdmin background

YesAdmin small background, based on iView-Admin and small white interface, no backend, no server, fast development of your business management background!

Features:

  • Local development and debugging: You can use iview-admin to develop and debug service functions locally
  • Gochuang cloud hosting operation: upload the package to Gochuang cloud for access and use

Technology stack

  • Iview-admin Open source framework
  • Xiaobai Open interface (free registration and use)

Local development

# cloning project git clone [email protected]: yesapicn/YesAdmin git # installation depend on NPM install # development NPM run devCopy the code

If you need to use the domestic Taobao image, you can use the following command:

# Use ali custom CNPM command line tool instead of default NPM
$ npm install -g cnpm --registry=https://registry.npm.taobao.org

Check whether the installation is successful
$ cnpm -v

# install dependencies
cnpm install

# development
cnpm run dev

Copy the code

configuration

Before use, you can register your account in Gochuang cloud for free, which is convenient for storing your own data. Once the registration is successfully activated, replace it with your interface domain name, app_key and key.

After registering, you can go to Gotron cloud to view your app configuration. Link: open. Yesapi. Cn /? R = App/mime

Experience account: API_demo, password: 123456. Before use, please register your own gochuang cloud account.

Small background root configuration

Locally, modify the configuration file:./vue.config.js

const BASE_URL = process.env.NODE_ENV === 'production' ? '/ admin - api_demo / / / online hosting environment root directory, the final formal access link is http://open.yesapi.cn/admin- your fruit and cloud/login account:'/' / / local root directoryCopy the code

Tips: Change the above /admin-api_demo/ to /admin- your guochuang cloud login account /.

Interface configuration

On the local PC, modify the configuration file./ SRC /config/index.js;

  {
   / * * *@description The small backend connects the user's APP_KEY and key * used to generate the dynamic signature in the request */
  OKAYAPI_APP_KEY: 'F9B**************************6A2'.// TODO:Your app_key
  OKAYAPI_APP_SECRECT: 'iFESz*********************************************************qW3nIPET'.// TODO:It is required only for local development and debugging, and can be null during construction
  }

  / * * *@description API request base path */
  baseUrl: {
    dev: 'http://api.yesapi.cn/yesapi/'.// TODO: your little white interface domain name
    pro: '/yesapi/'// The domain name needs no change
  },
  proxyTable: {
    '/api': {
      target: 'http://hn216.api.yesapi.cn/yesapi/'.// TODO: your little white interface domain name
      changeOrigin: true.// Start the proxy
      pathRewrite: {
        '^/api': '/'}}},Copy the code

Modified separately:

  • OKAYAPI_APP_KEY and OKAYAPI_APP_SECRECT
  • baseUrl.dev
  • proxyTable.target

The routing configuration

On the local PC, modify the route configuration file./ SRC /ruoter/index.js

const baseUrl = process.env.NODE_ENV === 'production' ? '/admin-api_demo/' : '/' // Be careful to distinguish between local and online environmentsCopy the code

Tips: Change the above /admin-api_demo/ to /admin- your guochuang cloud login account /.

Run locally

After modifying the above configuration, run the following command:

# development
npm run dev

# or

# development
cnpm run dev
Copy the code

Running effect

The login page:

Tips: The login account here is your application member, not gochuang cloud login account! You are advised to use the application administrator account. Click to see your app membership.

Add an article:

Tip: this is an example of a data model, which can be modified as needed to achieve data management, including adding, deleting, changing and checking.

Material library:

Upload pictures:

Tip: This section corresponds to the footage library.

Feature list

  • Login/Registration
  • Material library
    • Material management
    • Upload files and pictures
  • Data statistics
    • Log in statistics
    • Registration statistics
  • The article management
    • Article list Management
    • Add the article
    • To view the article
    • Upload a CSV/Excel file

More background functions can be developed according to business needs.

Build and publish

Run locally:

# build NPM run build # build CNPM run buildCopy the code

After the build, package the dist directory:

Log in to Gochuang Cloud Platform, upload and publish:

Release page: open.yesapi.cn/?r=App/Admi…

After release, the official environment access effect:

Once released, you can use it for your team.

License

MIT