Upload 4 files

app.py

@@ -0,0 +1,33 @@
+import streamlit as st
+
+st.set_page_config(
+        page_title="Welcome to AI club",
+        page_icon="👋",
+    )
+
+## Page layout
+@st.cache_data
+def main_layout():
+    st.sidebar.success("Select weekly task above.")
+    st.markdown(
+        """
+        This is our weekly tutorial pages.
+    
+        **👈 Select the weekly tutorial/tasks from the sidebar** to follow step by step.
+        
+        """
+        )
+    
+main_layout()
+
+st.markdown("""
+        ### Our member profile
+        - Coming soon ...
+        ### Our AI apps
+        - Coming soon ...
+        ### Relevent Documents (only if you have time to explore them by yourself)
+        - [Streamlit HowTos](https://docs.streamlit.io/library/api-reference)
+        - [Hugging Face HowTos](https://huggingface.co/docs/hub/spaces)
+        - [Learn to ClickUp](https://help.clickup.com/hc/en-us/categories/5414365970455-Features)
+        """
+        )

pages/1_101_notebook_setup.py

@@ -0,0 +1,67 @@
+import streamlit as st
+
+st.set_page_config(page_title="Notebook Installation", page_icon=":notebook:")
+
+st.markdown("# Steps to install Jupyter notebook")
+
+st.markdown(
+    """
+    #### :red[For Windows 10 or above:]
+    
+    ###### 1. Open CMD(Terminal) in your laptop
+    - You can type "cmd" in the "Type to search" window
+    - Then the Command Line (Terminal) should appear and you might run it;
+        
+    ###### 2. Install Python 3.11 into your laptop
+    - Type in the following code in your CMD and press "Enter" to execute
+
+    ```cmd
+       winget install python.python.3.11
+    ```
+    
+    ###### 3. Install Jupyter Notebook to your laptop
+    - Type in the following command in your CMD and press "Enter" to execute
+ 
+    ```cmd
+    pip install notebook
+    ```
+    ###### 4. Run notebook
+    - Type in the following command in your CMD and press "Enter" to execute
+ 
+    ```cmd
+    jupyter notebook
+    ```
+    - If you don't see a browser window popup, 
+    you can copy the url output in the terminal and paste it into a new browser tab to open the notebook,
+    """
+    )
+st.write("##")
+st.markdown(
+    """
+    #### :blue[For MacOS:]
+    
+    ###### 1. Install Python 3.11 into your laptop
+    - Check the webside [here](https://www.saintlad.com/install-python-3-on-mac/) for instruction
+
+    ###### 2. Upgrade pip3
+    - upgrade pip or pip3, type/copy the following into Mac terminal and execute
+
+    ```bash
+       pip3 install --upgrade pip
+    ```
+    ###### 3. Install jupyter notebook
+    - type/copy the following into Mac terminal and execute
+
+    ```bash
+        pip3 install jupyter
+    ```
+    ###### 4. Run notebook
+    - Type in the following command in your CMD and press "Enter" to execute
+ 
+    ```cmd
+    jupyter notebook
+    ```
+    - If you don't see a browser window popup, you can copy the url output in the terminal and paste it into a new browser tab to open the notebook.
+    """
+    )
+

pages/1_102_Manage_Your_API_Keys.py

@@ -0,0 +1,89 @@
+import streamlit as st
+
+st.set_page_config(page_title="API_Keys", page_icon=":secret:")
+
+st.markdown("# Manage your API keys")
+
+st.markdown(
+    """
+    Through out this term, you will use your API keys to access different servers such as Hugging Face and ChatGPT.
+    It is important to have a secured managment of your API keys on your computer. 
+    
+    **:red[REMEMBER:]**  
+            
+        Never display your keys in your code!
+        
+    - To get your **:blue[OpenAI]** key, you can follow the link [here](https://elephas.app/blog/how-to-get-chatgpt-api-key-clh93ii2e1642073tpacu6w934j)
+    - To get your **:green[Hugging Face]** API key, you can follow the steps below:
+    
+        1. Click on your profile image(of Hugging Face) and click your account name under "Profile";
+        2. In the left bar of your profile, click on "Settings";
+        3. In the left bar of the Settings page, click on "Access Tokens";
+        4. Click on "Copy the token" button, just right to the button "Show"
+        5. Then you have copied your token in the clipboard, we can now moving on to store it locally. 
+    """
+    )
+
+st.write("##")
+
+st.markdown(
+    """
+    #### Store API keys in the local environment
+    
+    ###### :blue[For MacOS/Linux:]
+    
+    ```bash
+    # 1. create .env file, for notebook, this can be done in your Jupyter notebook cell wiht "!" as prefix
+    touch .env
+
+    #2. hard code your key to .env
+    echo "HF_API_KEY=<Your Key here>" >> .env
+    ```
+    ###### :blue[For windows]
+    
+    - Using the option 2 from the [link](https://help.openai.com/en/articles/5112595-best-practices-for-api-key-safety )
+
+    ###### :blue[REMEMBER]:
+    
+    - Different API keys should have different names! For example:
+    - For OpenAI (ChatGPT), your name of key should be "OPENAI_API_KEY";
+    - For Hugging Face, your name of key should be "HF_API_KEY"
+    
+    """
+    )
+
+st.write("##")
+
+st.markdown(
+    """
+    #### Using your keys in notebook
+    
+    Once we have done above successfully, we can call our API keys in Jupyter Notebook
+    
+    1. Fistly, we install a convinient library
+    
+    ```cmd
+    !pip install python-dotenv
+    ```
+    remember: the prefix "!" is for Jupyter Notebook code cell only, if you are using command line directly, you don't need it.
+    
+    2. using the code snippet below in jupyter notebook code cell. 
+    
+    ```python
+    import os
+    from dotenv import load_dotenv
+    load_dotenv()
+
+    HF_API_KEY = os.getenv('HF_API_KEY') ## I use Hugging Face API key here as an example.
+    ```
+    
+    - You can then execute the following code in notebook to check if it is succeed
+    
+    ```python
+    print(HF_API_KEY)
+    # Remember: this is only in your notebook cell, for your own check, do not submit this to our code space later on.
+    ```
+    
+    
+    """
+    )

requirements.txt

@@ -0,0 +1 @@
+streamlit==1.24.0