Analyzing Stock data Using Django and React [Part 4]

Django

Github : KRX

1. spaCy’s lemmatization

• Currently, the code that only checks for “exceeded” (base)

  So, I modify the function to detect not just “exceed” but also its various forms (exceeded, exceeding etc..)

• lemmatization : converts words into their base or dictionary form

   # Detect comparison type (handle multiple forms of exceed and less)
    for token in doc:
        if "exceed" in token.lemma_ or "greater" in token.text or "above" in token.text:
            comparison_type = "greater_than_equal"
        elif "less" in token.text or "below" in token.text:
            comparison_type = "less_than_equal"
  

React

Github : KRX-frontend

1. Ternary Operator

• condition ? expressionIfTrue : expressionIfFalse

  It is a shorthand for an if-else statement

   <h3>Related Companies</h3>
   {companies.length > 0 ? (
      companies.map((company, index) => (
            <div
               key={index}
               onClick={() => setSelectedCompany(company)}
               style=
            >
               {index + 1}. {company.name} ({company.ticker})
            </div>
      ))
   ) : (
      <p>No companies found.</p>
   )}
  

2. Basic of React*

• State Management (useState)

  It is a React hook that lets you add state to functional components

   function StockQuery() {
      const [query, setQuery] = useState("");
      const [companies, setCompanies] = useState([]);
      const [selectedCompany, setSelectedCompany] = useState(null);
      const [price, setPrice] = useState(120);  // Default price
      const [comparisonType, setComparisonType] = useState("");
      const [step, setStep] = useState(1);  // Manages step 1, 2, and 3
      const [results, setResults] = useState([]);  // Holds the search results
  
      ...
  

  This code initializes query and updates it using setQuery()

• How it Works

  1. Initial State: useState("") initializes query as an empty string.

  2. State Updates: Each time setQuery() is called (e.g., when the user types), the state is updated.

  3. Component Re-renders: React automatically re-renders the component when the state changes.