deploying a React app that uses a Flask backend

See also questions close to this topic

• Jest: Test that function is called after setState

  How does one test that a function is called in the callback of Reactjs setState function.

  handleInputChange(field, value) {
    this.setState(
      {
        [field]: value,
      },
      () => {
        this.formIsValid(); //Test that this is called
      },
  );
  

  }

  Below is my test:

  test('it should call formIsValid', () => {
    const component = getShallowComponent();
    const mockFormIsValid = jest.fn();
  
    component.instance().handleInputChange('token', '132333');
    component.instance().formIsValid = mockFormIsValid;
  
    expect(mockFormIsValid).toBeCalled();
  });
  

  I expect that setState is resolved when using toBeCalled, but it does not work.
• How can I get another scene after reopen minimized app?

  I need to get lock scene when I reopen minimized app without seeing previous.

  I set the function which navigate to lock scene and call it if AppState changed to non-active

  But when I reopen app, firstly I see previous scene and then transition to lock scene.
• render function automatically trigger onClick props function issue in React?

  In parent component have one child component. In Child component I have one props with click function. In that click function, triggering before click while rendering component. I need to restrict that click function in render. Check below my code...

  I have parent component is APP.

      import React, { Component } from "react";
  import { withRouter } from 'react-router-dom';
  import { connect } from "react-redux";
  
  import { Pagination } from './../Common/index';
  
  class App extends Component {
  
    handlePageination = (current) => {
      console.log('trigger')
    }
  
    render() {
      return (
            <main className="main-block">
              <Pagination total={userList.length>0 ? totalCount : 0} range={10} initial={0} rowClick={this.handlePageination} count={currentPageNumber} />
            </main>
  
      )
    }
  }
  
  export default App;
  

  Child component...

  import React, { Component } from "react";
  import ReactPaginate from 'react-paginate';
  import { ORIGIN_PATH } from "./../../../utilities/consts";
  import "./Pagination.css";
  
  class Pagination extends Component {
  
      handlePageClick = (e) => {
          this.props.rowClick(e.selected)
      }
  
      render() {
  
          const { range, initial } = this.props;
  
          let { count, total } = this.props;
  
          count = count + 10;
          total = parseInt(total, 10);
  
          if(count===0 && total < 10) {
              count = total
          } else if(count >= total) {
              count = total
          }
  
          return(
              <div className="pagination-block">
                  <p>Showing {count} out of {total} results</p>
                  {<ReactPaginate previousLabel={<img src={ORIGIN_PATH + "/images/icons/polygon-prev-icon@3x.png"} alt="Prev" />}
                      nextLabel={<img src={ORIGIN_PATH + "/images/icons/polygon-next-icon@3x.png"} alt="Next" />}
                      breakLabel={<a href="">...</a>}
                      breakClassName={"break-me"}
                      pageCount={total/range}
                      marginPagesDisplayed={2}
                      pageRangeDisplayed={range}
                      onPageChange={this.handlePageClick}
                      containerClassName={"pagination"}
                      subContainerClassName={"pages pagination"}
                      initialPage={initial}
                      activeClassName={"active"} />}
              </div>
          )
      }
  }
  
  export default Pagination;
  
• Flask + Bokeh Server on Azure Web App Service

  I want to host my bokeh server app in Azure Web App Services. Following the example in flask_embed.py I created a minimal example with a bokeh server process running on localhost:5006 and serving it with server_document in a flask route. Locally, in my computer, it runs normally without any errors:

  from threading import Thread
  
  from bokeh.embed import server_document
  from bokeh.server.server import Server
  from bokeh.models.widgets import Select, Div
  from bokeh.layouts import column
  
  from flask import Flask
  from flask import render_template
  from tornado.ioloop import IOLoop
  
  app = Flask(__name__)
  
  # This is the bokeh page
  def modify_doc(doc):
      dropdown = Select(title="Cities", options=["New York", "Berlin"])
      title_row = Div(text="Home Page")
  
      main_layout = column([
          title_row,
          dropdown
      ])
  
      doc.add_root(main_layout)
      doc.title = "My bokeh server app"
  
  # This is the subprocess serving the bokeh page
  def bk_worker():
      server = Server(
          {'/bkapp': modify_doc},
          io_loop=IOLoop(),
          allow_websocket_origin=["*"],
      )
      server.start()
      server.io_loop.start()
  
  
  Thread(target=bk_worker).start()
  
  # This is the flask route showing the bokeh page
  @app.route("/", methods=["GET"])
  def my_app():
      script = server_document("http://localhost:5006/bkapp")
      return render_template("embed.html", script=script, template="Flask")
  

  However, when I push it to the Azure web app, the page is blank and by inspecting the page an error message is shown:

  GET https://<my-azure-site>.azurewebsites.net:5006/bkapp/autoload.js?bokeh-autoload-element=0bfb1475-9ddb-4af5-9afe-f0c4a681d7aa&bokeh-app-path=/bkapp&bokeh-absolute-url=https://<my-azure-site>.azurewebsites.net:5006/bkapp net::ERR_CONNECTION_TIMED_OUT
  

  It seems like I don't have access to the localhost of the remote Azure server. Actually, it's not yet clear to me if the bokeh server runs/is allowed to run at all. In the server_document function I have tried putting server_document("<my-azure-site>:5006/bkapp") but the problem remains the same.

  Any help is appreciated.

  This post is related to another question: Bokeh embedded in flask app in azure web app
• get method for flask-python

  I'm writing a post and get method in flask file upload. when we have upload file automatically saved in a seperate folder. in the image below shows the json data of the image "name, gender, feeling"enter image description here.--> here my question is how to get the json format in flask-python from ui.--> the json format how to get in the python.
• Improve latency of HTTP request function in Python using Flask

  In the process of using Eventbrite's API to power a website with their events, however, I am stuck on how to implement project.

  Currently, I am wanting to filter events via dates and show them on the front page, however, Eventbrite API limits to only 50 items per page. The API request pushes out 86 pages with 50 items each.

  How can I go about presenting those events at once while lowering latency? What I currently have takes 104 seconds to respond and render results to page. I'm scratching the surface on Big O Notation theory, however, I think I'm using O(n²).

  here's the code:

  routes.py:

  from flask import Flask, render_template
  from eventbrite import Eventbrite
  from datetime import datetime
  
  import requests, json
  
  app = Flask(__name__)
  
  
  # TODO: Remove outh key in file and register in sys
  oKey = ‘<oauth-key>’
  
  o_token_url = '&token={0}'.format(oKey)
  
  @app.route("/")
  def index():
  
      base_url = 'https://www.eventbriteapi.com/v3/'
      regions_url = base_url + 'system/regions/?token={0}'.format(oKey)
      regions_result = requests.get(regions_url)
      regions_obj = regions_result.json()
  
      e_url = base_url + 'events/search/?token={0}&location.address=<city>&start_date.range_start=2018-07-02T12%3A00%3A00Z&page=2'.format(oKey)
      e_result = requests.get(e_url)
      e_obj = e_result.json()
  
     list_events = []
  
      for pg in range(1, e_obj['pagination']['page_count']):
          print(pg)
          startTime = datetime.now()
  
          e_url = base_url + 'events/search/?token={0}&location.address=<city>&start_date.range_start=2018-07-02T12%3A00%3A00Z&page={1}'.format(oKey, pg)
          e_result = requests.get(e_url)
          e_obj = e_result.json()
  
          for i in e_obj['events']:
              an_event = {}
              an_event['name'] = i['name']['text']
              list_events.append(htx_event)
  
      print(datetime.now() - startTime)
      return render_template('index.html', events=list_events)
  
  if __name__ == "__main__":
      app.run(host='0.0.0.0')
  

  index.html:

  {% for event in events %}
  {{event['name']}}<br>
  
  {% endfor %}
  

  I am aware of EB API batched requests endpoint however, I can't wrap my head around on how to send the list of url dictionaries with requests.

  Any tips on how to optimize the code above would be appreciated. I figured I can limit the amount of events that are shown at any given time, however, interested in how others would approach this issue.