With the inundation of data, and the pace at which it is created, traditional
computing methods possess limited means to deliver results. On the other
hand, cloud computing acts as an enabler, allowing one to overcome the
limitations of the former. With increased scalability, reduced costs, and
enhanced adaptability, cloud service providers, developers, and users alike
stand to gain from the fruits of migrating to the cloud.
Given that Python is currently the scripting language of choice for most
of the software development community, it is absolutely vital to provide
a web framework for developers that would bridge their skills gap. While
legacy frameworks such as Flask and Django solicit a firm understanding
of HTML and CSS, Streamlit is the first major framework that is all pure
Python, thereby reducing development time from weeks to hours.
1.1 Why Streamlit?
Limiting oneself to local computing options is simply a figment of the
distant past, given that the cloud unlocks a host of advantages and allows
developers to leave a tangibly greater impact on the world. It is for this
very reason that an entire new echelon of developers are beginning to
embrace everything cloud, and the rapid transition toward this newChapter 1 GettinG Started with Streamlit
paradigm of computing is a testament to that fact. And this is exactly where
a pure Python web framework such as Streamlit can deliver a lot of value
to developers who want to make the transition but who need an enabler
to do so.
1.1.1 Local vs. the Cloud
The cloud is rapidly becoming synonymous with data itself. Quite literally,
wherever there is an abundance of data, it is somehow intertwined with
cloud computing. Put into layman’s terms, it is simply inconceivable to
harness the value of big data without utilizing the resources of the cloud.
Gone are the days where one would brandish Microsoft Excel to create a
1990s style dashboard for their dataset. With the sheer magnitude of data
exposed to us, local computing will not make the cut.
Even still, there are certain tangible benefits to local computing,
namely, prototyping an idea is considerably faster, and latency between
nodes and servers is several orders of magnitude smaller. This is why
edge computing still holds an “edge” over the cloud, no pun intended.
In addition, there are applications for which security is sacrosanct and/
or regulations are inhibiting, and in that case, one may be better off
disconnecting themselves from the world at large. Other than that, there
is not much else that one can attribute to the list of benefits of local
computing. However, there is a plethora of reasons why you should steer
clear of it. To name a few, the bottom line will be quite lower with the
overheads solicited to run the infrastructure at hand. There will also be
very limited adaptability to fluctuating traffic; imagine the half-time surge
in traffic during the Super Bowl, you simply will not be able to scale to
meet demand.
On the other hand, cloud computing is cheaper to provision,
exceedingly adaptable to demand, highly robust against failure, and
supremely reliable to run. In addition, cloud computing platforms enable
scalability in two dimensions – horizontal and vertical. Horizontal forwhen you need multiple instances of the same computing resources and
vertical for when you need bespoke resources, the likes of GPUs, TPUs,
database systems, and more. Perhaps, the single most salient factor about
the cloud is that it expands your horizons and allows you to offer your
product as a service on the World Wide Web. The latest paradigm shift in
tech is to offer quite literally anything as a service. The as-a-service model
(aaS) can be applied to software (SaaS), machine learning (MLaaS), and
any other product that can be offered as a web application on the Internet.
And this is precisely where a web framework such as Streamlit fits the bill.
Streamlit is a cloud enabler for those of us in the software development
community that have been unable to deploy our value to the Internet due
to a hefty skills gap that has thus far impeded us from doing so. Concisely
put, Streamlit is a means of empowerment for developers at all levels1.1.2 A Trend Toward Cloud Computing Cloud computing is north, south, east, and west. Academia, the corporate world, governments, and even spy agencies are shifting from local to the cloud at a breathtaking pace. With legacy software providing limited means for growth and return on investments, organizations are increasingly migrating to cloud service providers who in turn offer agility, economies-of-scale, and advanced computing resources. Even CSPs themselves are jumping on the bandwagon, with the likes of Google and Microsoft offering their legacy applications on the cloud with Google G Suite and Microsoft Office 365. Evidently, from a business perspective, the justification is even more so robust. Disruptive businesses are as pervasive as they have ever been and have wholly championed what others had so far been reluctant to accept. Therefore, embracing the cloud is no longer a subjective decision but rather a means for survival. With reduced lead time, scalability, limited capital investments, and increased innovation, businesses stand to gain a great deal. From a CSP perspective, this proposition is possibly even 3 Chapter 1 GettinG Started with Streamlit more enticing. Equipped with the cloud, CSPs are able to pool resources together, increase resource elasticity, and reduce maintenance and overheads. And perhaps most importantly, from a consumer’s point of view, the cloud is the best thing that ever happened since the Internet itself. As a consumer, the SaaS model offers unparalleled flexibility, price granularity, and plenty more bang for the buck. In other words, the cloud is win-win-win; everyone stands to gain. While the trend toward cloud computing was already on a healthy trajectory, a once-in-a-century pandemic doubled as a booster toward everything cloud. The pandemic all but destroyed the stigma associated with remote learning, online examinations, working from home, and other dogma that decades of noble efforts by the tech community had failed to make a dent into. It is fair to assume that from here onward, the progression toward everything cloud will exceed the prediction of pundits. And if numbers alone can serve to indicate where we are heading, then one should feast themselves on the omen of Figure 1-1. Figure 1-1. Growth of the public cloud computing market from 2008 to 2020. Source: statista.com [13] 4 Chapter 1 GettinG Started with Streamlit 1.1.3 History of Web Frameworks in Python Web development can be quite an arduous task, soliciting a multidisciplinary team with expertise in frontend, backend, and server- side software development. It is for this very reason that full-stack developers who brandish the know-how for the entire development process are in surplus demand and are often in receipt of a handsome compensation. Traditionally, these developers would resort to using JavaScript, PHP, or Perl to develop web applications, with Python being sidelined as a local scripting language. This was due to the fact that Python is not inherently designed to run on the Internet and requires a web framework to interface with web servers and browsers. Over the years however, the community has developed several novel frameworks that allow Python to be utilized effectively for the Internet. And given Python’s emphasis on simplicity, readability, rich ecosystem of libraries, and being open source, it has steadily transformed into one of the main web scripting languages of choice for many developers. Python has even gained enough traction to being adopted by heavyweights, the likes of Google and Instagram. Generally, such web frameworks come in two types, full-stack and nonfull-stack. They manage everything from communications and infrastructure to other lower-level abstractions required by web applications. Nontrivial applications require a slew of functionalities including but not limited to interpreting requests, producing responses, storing data, and rendering user interfaces. For such applications, one would often utilize a full-stack framework that provides an in-house solution for all the technical requirements. This contrasts with nonfull- stack frameworks otherwise known as microframeworks that provide a bare minimum level of functionality, typically limited to routing HTTP requests to the relevant controllers, dispatching the controller, and subsequently returning a response. Such frameworks are usually stacked with other APIs and tools in order to create applications. Some of the most popular examples of each type are listed in the following sections. 5 Chapter 1 GettinG Started with Streamlit 1.1.4 Flask Flask was developed in 2010 by Armin Ronacher from what was allegedly an April fool’s joke to begin with. Flask is a nonfull-stack or microframework that provisions an application server without offering much else in terms of components. Flask is composed of two main elements: Werkzeug, a tool that lends support for HTTP routing, and Jinja, a template engine used to render basic HTML pages. In addition, Flask uses MarkupSafe as a string handling library and ItsDangerous as a secure data serialization library to store session data as cookies. Flask is a minimalistic framework that is equipped with the bare minimum of the components required to render a web application. Consequently, the developer is afforded a great deal of autonomy and also responsibility to create their own application. As a result, Flask is best suited for static websites and for experienced developers who are able to provision most of their own infrastructure and render their own interfaces. 1.1.5 Django Django was developed by a group of web programmers in 2003 who used Python to build web applications. It allows developers to create complex applications with relatively less overhead in comparison to Flask. Specifically, Django enables programmers to render dynamic content with enhanced scalability and with in-house capabilities to interface with database systems using object-relational mapping. In addition, there are a host of other modules including but not limited to ecommerce, authentication, and caching packages that allow the developer to readily provision extended services. Bundled with a multitude of other third-party packages, Django allows the developer to focus mainly on the idea while not having to worry much about the implementation. 6 Chapter 1 GettinG Started with Streamlit 1.1.6 Dash Dash is a web framework developed by Plotly to render enterprise- grade web applications in Python, R, and even Julia. Given that Plotly predominantly develops data analytics and visualization tools, similarly Dash is more often used to create dashboards. Even still, it is indeed possible to create a host of general-purpose applications with due to its extended customizability. Dash has the ability to natively support D3.js charts and provides default HTML and CSS templates to use. However, for more tailored interfaces, developers must be well versed with frontend programming themselves. Furthermore, Dash tenders an enterprise package that enables experienced developers to deploy their applications on the cloud with production-grade capabilities such as authentication and database systems. 1.1.7 Web2Py Web2Py is a full-stack web framework for Python which like Django makes use of the model view controller architectural paradigm. It allows developers to create primitive yet dynamic content with relative ease and interfaces natively with database systems. The novelty of this framework as opposed to others is that it comes with its own web-based integrated development environment equipped with a ticketing system for error tracking and management. The main disadvantage however is that Web2Py executes objects and controllers via a single global environment that is initiated at each HTTP request. While this has its benefits, it does also carry the pitfalls of experiencing compromised performance and incompatibility issues with certain modules. 7 Chapter 1 GettinG Started with Streamlit 1.1.8 The Need for a Pure Python Web Framework Previously, the community of Python developers would have to suffice with deploying their software locally as desktop applications unless they commanded adept knowledge of HTML, CSS, and JavaScript. With Tkinter and PyQt, programmers can indeed produce complex, dynamic, and aesthetically pleasing interfaces, albeit with the heartbreak of not being able to render it on the Web. And this has largely been the predicament of many Python loyalists, who, up until recently, had no pure Pythonic way of migrating to the cloud. It was always quite demeaning to peruse through repository after repository of awesome applications developed by people who had no other way of exposing their goodness to the world than sharing the source code with others hoping that they would be able to replicate it locally. Oh, and forget about the nontechnical users who had no hope whatsoever of executing even as much as that. Countless noble efforts were left largely unutilized in vain as a result. In other words, the community was in desperate need of a major framework that would solicit no additional expertise other than the knowledge of writing your average Python script and being able to deploy it instantly to a cloud server. Then came along Streamlit and freed developers from the shackles of HTML, CSS, and JavaScript. The rest will be history. 1.1.9 Academic Significance Being able to create web apps directly from Python easily has made Streamlit a valuable tool for academia [1]. Despite its recent creation, the first beta release is dated April 2019; research teams worldwide have started adopting the framework to showcase the outcomes of their projects. Today, many publications already mention Streamlit as their visualization framework covering a wide range of fields. Some of these areas include health [2, 3, 4, 5], computer science [6, 7, 8, 9], economics [11, 10], and civil engineering [12], to mention a few. 8 Chapter 1 GettinG Started with Streamlit 1.2 Firing It Up Being the highly versatile and accommodating framework that it is, Streamlit allows the developer to utilize it with a variety of computing resources and technical stack. Even still, there are some recommended best practices to follow for greater ease and usability. 1.2.1 Technical Requirements While there is no one-size-fits-all solution when it comes to running Streamlit, the following computing and system requirements or greater are recommended for developing and running applications smoothly. Table 1-1. Hardware requirements CPU RAM Storage Internet/Network access 2 x 64-bit 2.8 Ghz 4 GB 1600 mhz ddr3 120 GB 1 mbps Table 1-2. System requirements Operating System Database Ubuntu 16.04 to 17.10 windows 7 to 11 mac OS X 10.11 or higher linux: rhel 6/7 postgreSQl 9.6 or higher pgadmin v4.0 or higher Table 1-3. Software requirements Streamlit Anaconda 1.9 or higher with python 3.8 or higher 9 Chapter 1 GettinG Started with Streamlit Table 1-4. Network requirements Inbound Ports Outbound Ports http: tCp 8080, 8443 httpS: tCp 443 SSh: tCp 22 Smtp: tCp 25 ldap(s): tCp 389/636 1.2.2 Environment Installation with Anaconda In order to create a web application run on a local Streamlit server for prototyping and testing, we first need to install and create a Python runtime environment with all the dependencies required for our server. In this regard, we will be making use of Anaconda which is one of the most widely used and supported Python distributions available. First, proceed with downloading and installing a compatible version of Anaconda. Once the installation has been successfully completed, you may then create a virtual environment that will be used to download and install the packages necessary to run your web application. Programmatic Installation To create an Anaconda environment through the console, please follow these steps: 1. To create and install your environment programmatically, enter the following commands in Anaconda Prompt sequentially: conda create -n python= When conda asks you to proceed, select y. proceed ([y]/n)? 10 Chapter 1 GettinG Started with Streamlit Subsequently, the new environment will be created in the environments folder within the root directory of Anaconda as C:/ProgramData/Anaconda3/envs/. 2. Activate your environment by typing the following: conda activate 3. If you have a list of dependencies, dependencies. yml, place it in your newly created environment’s directory: C:/ProgramData/Anaconda3/envs/ environment name/ 4. Change your root directory to your environment’s directory by typing the following: cd C:/ProgramData/Anaconda3/envs// 5. Ensure that the first line in the dependencies.yml is written correctly as the name of your environment, name: environment name; otherwise, the environment may not be installed. 6. Update your environment by installing all the dependencies listed in the file dependencies.yml by typing the following: conda env update -f dependencies.yml 7. If prompted by Anaconda, proceed with updating your version of conda by typing the following: conda update -n base -c defaults conda 8. To check the list of environments, type the following: conda info -envs 11 Chapter 1 GettinG Started with Streamlit 9. To check the list of dependencies in your environment, type the following: conda list 10. To install additional dependencies that may be required later, please type the following: conda install 11. Some dependencies may not be available for download via conda install; in this case, download pip and subsequently use pip install as shown in the following: conda install pip pip install 12. To deactivate your environment, you may type the following: conda deactivate Graphical Installation Alternatively, you may use Anaconda Navigator to create and maintain your environments as follows: 1. Launch Anaconda Navigator. 2. Click the Environments tab. 12 Chapter 1 GettinG Started with Streamlit Figure 1-2. Opening the Environments tab in Anaconda 3. Click the Create button and enter the desired name and Python version for your environment. Figure 1-3. Creating an environment in Anaconda 13 Chapter 1 GettinG Started with Streamlit 4. Next, follow steps 2–12 in the previous section to install the dependencies. Subsequently, as shown in Figure 1-4, the test_environment environment will appear activated with all the required packages installed. Figure 1-4. Newly created environment in Anaconda 5. Finally, you will be able to launch any of the available code editors in Anaconda within your newly created environment in the Home tab. 14 Chapter 1 GettinG Started with Streamlit Figure 1-5. Selection of code editors in Anaconda 1.2.3 Downloading and Installing Streamlit There are multiple ways to download and install the Streamlit library for use, and in this section, we will cover one of the most commonly used types of installation. Direct pip Installation 1. To download and install Streamlit, first ensure that you are in the correct environment by entering the following command in Anaconda Prompt: conda activate 2. Subsequently, you may download and install Streamlit by entering the following command: pip install streamlit 15 Chapter 1 GettinG Started with Streamlit Manual Wheel File Installation 1. Ensure that you are in the correct environment by entering the following command in Anaconda Prompt: conda activate 2. Manually download the wheel installation file from https://pypi.org/project/streamlit/ 3. Change the directory to where the wheel file is located: cd C:/Users/…/ 4. Subsequently install the downloaded wheel file by entering the following command: pip install streamlit-1.0.0-py2.py3-none-any.whl If the installation has been successful, you may proceed with creating your script. For good measure, restart Anaconda before you do so. Importing Streamlit To import Streamlit into your Python script, ensure that the following line precedes the rest of your code: import streamlit as st Subsequently, any Streamlit method can be invoked by appending st to it as follows: st.write(‘Hello world’) 16 Chapter 1 GettinG Started with Streamlit 1.2.4 Streamlit Console Commands When Streamlit is installed, the Streamlit command-line (CLI) tool is also installed. The command line can help you run, operate, and diagnose issues related to your Streamlit application. To get additional help, enter the following command: streamlit –help To run your application, ensure that you have changed the directory to where your script is located: cd C:/Users/…/script directory/ Then enter the following to run your script: streamlit run [–script args] Subsequently, your application’s local URL and network URL will be displayed. Simultaneously, your application will automatically appear on your default web browser. You may use the local URL to connect to your application locally and the network URL to connect on any other device over the local area network. 17 Chapter 1 GettinG Started with Streamlit Figure 1-6. Console while running the Streamlit application To clear the cache, enter the following command: streamlit cache clear To open Streamlit’s documentation on a web browser, enter the following command: streamlit docs To display Streamlit’s version, enter the following command: streamlit –version Configuring Streamlit Through the Console You may pass config options to streamlit run to configure options such as the port the application is being run on, disable run-on-save, and others. For an exhaustive list of configuration options, enter the following command: streamlit run –help 18 Chapter 1 GettinG Started with Streamlit You can view the list of configured options by entering the following command: streamlit config show You may configure these options using one of the four following methods: 1. Using a global config file at .streamlit/config.toml: [server] port = 80 2. Using a config file for each project in your project’s directory: C:/Users/…/.streamlit/config.toml. 3. Using STREAMLIT_* environment variables as shown in the following: export STREAMLIT_SERVER_PORT=80 4. Using flags in the command line when running your script as shown in the following: streamlit run –server.port 80 1.2.5 Running Demo Apps To run Streamlit’s demo applications, enter the following command: streamlit hello Subsequently, the following application will be displayed on your default web browser. You may use the menu on the sidebar to visit the four following demo applications. 19 Chapter 1 GettinG Started with Streamlit Figure 1-7. Streamlit demo application home page Figure 1-8. Streamlit animation demo application 20 Chapter 1 GettinG Started with Streamlit 1.2.6 Writing and Testing Code with PyCharm Generally speaking, code expands over time, whether by making new modules in the original code base or integrating it with third-party services. As a step toward making sure the code performs flawlessly, testing can be utilized. Code testing can be broken down to two methods: unit testing and integration testing, where both can be used to test independent modules and the whole system end to end, respectively. For the sake of this example, we will cover unit tests, but the same concept can be applied to the other option. Either way, we need to give inputs and compare expected outputs against actual ones. For a simple Streamlit application which enables the user to calculate the sum of any two numbers, we can test two main parts, one being if the web application is rendered according to our expectations and the other to verify the summation logic is correct. These are two different unit tests to do, but the first is a common thing to do when developing any frontend work. Listing 1-1 is the sample application we are trying to test in this example with output of Figure 1-12 when ran with Streamlit. Listing 1-2 tests both rendering and summation logic of the mentioned example. Figure 1-9. Streamlit plotting demo application 21 Chapter 1 GettinG Started with Streamlit Figure 1-10. Streamlit mapping demo application Figure 1-11. Streamlit dataframe demo application 22 Chapter 1 GettinG Started with Streamlit Listing 1-1. main.py import streamlit as st def calculate_sum(n1, n2): return n1 + n2 st.title(“Add numbers”) n1 = st.number_input(“First Number”) n2 = st.number_input(“Second Number”) if st.button(“Calculate”): st.write(“Summation is: ” + str(calculate_sum(n1, n2))) Listing 1-2. Unit_test.py from main import calculate_sum from selenium import webdriver from selenium.webdriver.chrome.options import Options import time def test_user_interface(): # Path to chromedriver. Can end with .sh if on (Li/U)nix environments driver_path = r”———-\chromedriver.exe” options = Options() options.add_argument(“–headless”) # To not open a real chrome window with webdriver.Chrome(driver_path, chrome_options=options) as driver: url = “http://127.0.0.1:8501” driver.get(url) time.sleep(5) html = driver.page_source 23 Chapter 1 GettinG Started with Streamlit assert “Add numbers” in html assert “First Number” in html assert “Second Number” in html def test_logic(): assert calculate_sum(1, 1) == 2 assert calculate_sum(1, -1) == 0 assert calculate_sum(1, 9) == 10 if __name__ == “__main__”: test_logic() test_user_interface() Figure 1-12. Output of Listing 1-1 To test rendering, we first need the application to be running, so it can be accessed by selenium’s driver, which is Chrome in this example. To automate launching the application before running the tests, we might need to use an advanced IDE. PyCharm can do the required job for us. 24 Chapter 1 GettinG Started with Streamlit First, we need to set up a running configuration to run Streamlit on a button click as seen in Figure 1-13. Now as we have a configuration used to run Streamlit, we can use it as a prerun command in another configuration which shall be used for running the unit tests (Figure 1-14). 1.3 How Streamlit Works Unlike other web frameworks which send static files to the browser, Streamlit modifies the real DOM and its state to render the final web document from the server side. There shall be no security concerns under normal user behavior. Like PHP, this can be RCE (Remote Code Execution) susceptible, if it was poorly coded, where user input is not sanitized where it can be used to execute OS-level code. Having a Streamlit web application starts from executing the binary, whether streamlit.exe on Windows or stream-lit.sh on MacOS or Linux, against the target document using the default Python interpreter. This will initialize the application configuration such as secrets, settings, themes, and, most importantly, the Delta Generator (DG for short) which acts as the middleman between the Python script and the ReactJS web application served by Streamlit. 25 Chapter 1 GettinG Started with Streamlit Figure 1-13. Making a shell command to run once the current configuration is chosen and ran 1.3.1 The Streamlit Architecture The DG takes care of efficiently transferring HTML components to be rendered on the client side and retrieving back their state. The initial render starts from the beginning of the Python document and ends at the last line. The next render does not start from the beginning of the file executed, but from the component which had been interacted with by the user or changed state; this will be covered in detail in later chapters. Every new render of a component will be queued in the DG, which will later 26 Chapter 1 GettinG Started with Streamlit be replaced with a new HTML snippet or be newly placed between other rendered HTML components on the final DOM. Streamlit components are queued and rendered individually to avoid negatively affecting the user’s experience with a blank page if renders take too long. Such delays can occur from an extensive ongoing computation, waiting for API responses, or even sleep functions, as shown in Listing 1-3. Listing 1-3. Code snippet to display random text with a delay within the execution import streamlit as st import time # User sees this first st.title(“My Title”) time.sleep(2) 2
Nullam dignissim, ante scelerisque the is euismod fermentum odio sem semper the is erat, a feugiat leo urna eget eros. Duis Aenean a imperdiet risus.
