Merge pull request #4 from LambdaTest-GitHub-Octernship/feedback

Added Docs and code reformatting

Author: AtmegaBuzz

readme.md

@@ -1,77 +1,84 @@
-## LambdaTest
+## LambdaLogs
 
 [![LambdaTest_Logo](https://www.lambdatest.com/resources/images/guideline/ltlambdabrand.svg)](https://www.lambdatest.com/)
 <!-- <img src="https://www.lambdatest.com/resources/images/guideline/ltlambdabrand.svg"  width="600" height="300"> -->
 
-### Company information 
+### About LambdaTest 
 [LambdaTest](https://www.lambdatest.com/) is a continuous quality testing cloud platform that helps developers and testers ship code faster. Over 2 Million users across 130 countries and leading enterprises rely on LambdaTest for their testing needs. LambdaTest platform provides secure, scalable, and insightful test orchestration for customers at different points in their DevOps (CI/CD) lifecycle
 
-### Why participate in an Octernship with LambdaTest
+# About
+LambdaLogs is a powerful network log visualization tool designed to help businesses identify potential issues with their websites and endpoints quickly and easily. By scraping site data and storing network logs in a database, LambdaLogs provides an efficient way to perform daily audits and identify failing endpoints before they cause problems.
 
-LambdaTest is building a seamless omnichannel digital experience testing platform for modern businesses across industries. Think of us as the test execution and orchestration backbone for leading global digital businesses. We work closely with the larger open-source and testing community through a lot of our initiatives.
+With its intuitive front-end interface, LambdaLogs enables users to easily visualize network logs and quickly identify areas for improvement. Whether you're a small business owner or a large enterprise, LambdaLogs provides the insights and data you need to keep your website running smoothly and efficiently.
 
-One of LambdaTest’s major product components is our visualization offering. In this role, you will get a chance to work as a full-stack engineer for this offering. You will specifically be working on graphs and logs that are crucial for development teams to understand various aspects of their test execution. You’ll work closely with our engineering and product teams and get to do both the engineering and documentation parts of the process. Your work will be a game changer for more than 2mn users, across 10,000+ companies and 130+ countries.
+So if you're looking for a powerful tool to help you optimize your website and improve your business operations, look no further than LambdaLogs.
 
-### Octernship Role Description
-<!--- Use this section to describe the role in as much detail as necessary. Please include the GitHub Classroom assignment submission date, length of the Octernship, and the monthly stipend --->
-We're looking for a full-stack developer to join our engineering team. 
+## Logs Page
+<img alt="LambdaLogs Logs Page" src="https://user-images.githubusercontent.com/68425016/227501453-e64d5d4d-b31a-4724-a24f-5715069b16e9.png"  style="margin-left:10px; margin-bottom:10px;" width="100%" align="center"/>
+<br /><br />
 
-| Octernship info  | Timelines and Stipend |
-| ------------- | ------------- |
-| Assignment Deadline  | 8 April 2023  |
-| Octernship Duration  | 3 Months  |
-| Monthly Stipend  | $500 USD  |
+## Status Code Visualization Page (Line Chart)
+<img alt="LambdaLogs Status Logs Page" src="https://user-images.githubusercontent.com/68425016/227501830-d4dc21f7-4717-40b4-9264-311696e5b55f.png"  style="margin-left:10px; margin-bottom:10px;" width="100%" align="center"/>
+<br /><br />
 
-### Recommended qualifications
-<!--- Use this section to describe what skills a student might need to complete the problem statement on GitHub Classroom --->
-- Experience with Git & GitHub
-- Writing modern JavaScript/Node.js/Golang/Python
-- Passion for open source & web standards
+## Status Code Visualization Page (Pie Chart)
+<img alt="LambdaLogs Status PieChart" src="https://user-images.githubusercontent.com/68425016/227502438-f324a918-f10c-4af7-90dc-0a77f63f281e.png"  style="margin-left:10px; margin-bottom:10px;" width="100%" align="center"/>
+<br /><br />
 
-### Eligibility
-To participate, you must be:
-* A [verified student](https://education.github.com/discount_requests/pack_application) on Global Campus
-* 18 years or older
-* Active contributor on GitHub (monthly)
+# Development Setup
 
-# Assignment
-## Test Logs Visualization with Graphs
-As a company, I run ~2 Million Selenium test Network logs a day on cloud. Build an ability to graphically visualize the logs using a low end resource cloud architecture framework. This code should be able to package and run on self-hosted machines or on cloud with proxy settings and public APIs for subscribed customers. 
+## Setup virtualenv 
+```sh
 
+    pip install virtualenv
+    virtualenv venv
+    
+    # Activate For Linux
+    source venv/bin/activate
 
-### Task instructions
+    # Activate For Windows 
+    ./venv/Scripts/activate
 
-The following are the prerequisites for the task: 
-- Setup Selenium on your local machine 
-- Write the script for opening the URL (https://www.lambdatest.com/) 
-- Click on each header navigation items 
-- Store the network logs generated on the browser to your local machine. 
-- Repeat the process for more than 100 tests
+    # install dependencies
+    pip install -r server/requirements.txt
+```
 
-The following are the requirements for the task: 
-Use a lightweight graph library which can render a time series of 365 days on the x-axis and y-axis should be the following: 
-- Total count of logs 
-- Logs count/average stacked by log type (mime-type)
-- Logs count/average stacked by log level (Status Codes) 
-- Logs should be able to filter on the UI by any available key-value. 
-- Logs should be searchable with a keyword using an API to fetch the results. 
+## Setup Elastic-Search using docker 
+```sh
+    docker pull elasticsearch
+    docker run -p 127.0.0.1:9200:9200 -p 127.0.0.1:9300:9300 -e "discovery.type=single-node" docker.elastic.co/elasticsearch/elasticsearch:7.17.9
+```
 
-You can use the recommended tech stack for developing this fullstack application: 
-- ElasticSearch or any text search engine. 
-- ReactJS 
-- Go lang (or) Python for server 
+## Run Scrapper
+```sh
+    cd server
+    python scrapper/scrapper.py
+```
 
-### Task Expectations:
-Students are expected to use the GitHub Flow when working on their task. This includes
+## Run Backend
+```sh
+    cd server/app
+    uvicorn main:app --reload
+```
+
+## Run Frontend
+```sh
+    cd frontend 
+    npm install
+    npm start
+```
+
+### Ready to go now
+
+Then go to `http://0.0.0.0:3000/` to see the frontend
+
+Add `http://0.0.0.0:8000/docs` for API Docs.
 
-1. Making changes on the auto generated `feedback` branch to complete the task
-2. Using the auto generated **Feedback Pull Request** for review and submission
-3. Using GitHub Discussions to ask any relevant questions regarding the project
 
 ### Resources
 - Install [npm](https://docs.npmjs.com/downloading-and-installing-node-js-and-npm)
 - Sample GitHub [Issue](https://github.com/npm/cli/issues/6051)
 - [ElasticSearch](https://www.elastic.co/guide/index.html) documentation
 - [ReactJS](https://reactjs.org/docs/getting-started.html) documentation
-- [Go lang](https://go.dev/doc/) or [Python](https://www.python.org/doc/) documentation
-- [Gin](https://gin-gonic.com/docs/) or [FastAPI](https://fastapi.tiangolo.com/) documentation
+- [Python](https://www.python.org/doc/) documentation
+- [FastAPI](https://fastapi.tiangolo.com/) documentation

server/.env

@@ -1,5 +1,5 @@
 ELASTICSEARCH_HOSTS=http://localhost:9200
 
-DEBUG=0
-CORSMiddleware=0
+DEBUG=True
+CORSMiddleware=True