{"id":22115351,"url":"https://github.com/guptaravimp/quickshipapp","last_synced_at":"2026-04-10T01:09:08.564Z","repository":{"id":259764001,"uuid":"879371985","full_name":"guptaravimp/QuickShipApp","owner":"guptaravimp","description":"Developed a delivery estimation application using React, Vite, and CSV data files to provide a user-friendlyexperience for product selection and delivery timeline estimates","archived":false,"fork":false,"pushed_at":"2024-12-21T20:14:39.000Z","size":1066,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-01-29T11:14:34.283Z","etag":null,"topics":["csv","csv-parser","javascript","nodejs","reactjs"],"latest_commit_sha":null,"homepage":"https://quick-ship-app.vercel.app","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/guptaravimp.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2024-10-27T18:19:01.000Z","updated_at":"2024-12-21T20:14:42.000Z","dependencies_parsed_at":"2024-10-27T22:38:03.208Z","dependency_job_id":"f26f52d3-3a76-411e-9b44-5f0720f09a8c","html_url":"https://github.com/guptaravimp/QuickShipApp","commit_stats":null,"previous_names":["guptaravimp/quickshipapp"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/guptaravimp%2FQuickShipApp","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/guptaravimp%2FQuickShipApp/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/guptaravimp%2FQuickShipApp/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/guptaravimp%2FQuickShipApp/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/guptaravimp","download_url":"https://codeload.github.com/guptaravimp/QuickShipApp/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":245212960,"owners_count":20578549,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["csv","csv-parser","javascript","nodejs","reactjs"],"created_at":"2024-12-01T12:15:33.018Z","updated_at":"2025-12-30T23:28:04.652Z","avatar_url":"https://github.com/guptaravimp.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\n# DeliveryApp\n## Live Link: https://quick-ship-app.vercel.app/\n### Developed a delivery estimation application using React, Vite, and CSV data files to provide a user-friendlyexperience for product selection and delivery timeline estimates\n\nDeliveryApp is a React-based application for managing product delivery estimates based on user-selected products and pincode-based logistics. It calculates and displays estimated delivery dates for orders based on various logistics providers and includes a real-time countdown timer for same-day delivery.\n\n● Built a scalable delivery app leveraging React and React Router to manage navigation and dynamic data.\n\n● Integrated CSV data with PapaParse for accurate product availability and delivery estimates by pin code.\n\n● Added a countdown timer for same-day cutoff alerts and reusable components for easy navigation and data\n# Project Structure\n\n\n\n\n\n![Screenshot 2024-10-28 195537](https://github.com/user-attachments/assets/95d8bfba-df07-4ce2-9284-f296d4d3223d)\n\n\n# Setup React Vite + Tailwind \n## Step 1: Create a Vite Project:\n\n1. Open your terminal and navigate to the directory where you want to create your project.\n2. Run the following command to create a new Vite project:\n```bash\nnpm create vite@latest DeliveryApp -- --template react\n```\n3. Change to the project directory:\nRun the following command \n```bash\n cd DeliveryApp\n```\n## Step 2: Install Tailwind CSS\n\n1. Install Tailwind CSS and its dependencies:\n```bash\nnpm install -D tailwindcss postcss autoprefixer\n```\n2. Initialize Tailwind CSS:\nRun the following command \n```bash\n npx tailwindcss init -p\n```\n## Step 3: Configure Tailwind CSS\n1. Open the tailwind.config.js file and update the content array to include your project files:\n```bash\n /** @type {import('tailwindcss').Config} */\nmodule.exports = {\n  content: [\n    \"./index.html\",\n    \"./src/**/*.{js,jsx,ts,tsx}\",\n  ],\n  theme: {\n    extend: {},\n  },\n  plugins: [],\n};\n\n```\n2. Open your main CSS file (typically located at src/index.css) and add the following lines to include Tailwind's base, components, and utilities:\n```bash\n@tailwind base;\n@tailwind components;\n@tailwind utilities;\n\n```\n## Step 4: Run the Development Server\nStart the development server locally:\n```bash\n@tailwind base;\n@tailwind components;\n@tailwind utilities;\n```\nOpen your browser and navigate to http://localhost:5173 (the default port) to see your React app with Tailwind CSS set up.\n\n# Deploying It on Github \n## Step 1: Initialize Git and Create a Repository\n1. Initialize a Git repository (if you haven’t already):\n```bash\ngit init\n```\n2. Check the status of all files\n```\ngit status\n```\n3. Add your files to the repository:\n```bash\ngit add .\n```\n4. Commit your changes:\n```bash\ngit commit -m \"Initial commit\"\n\n```\n5. Create a new repository on GitHub:\n\nGo to GitHub and create a new repository named DeliveryApp.\n\n6. Link your local repository to GitHub:\n```bash\ngit remote add origin https://github.com/guptaravimp/DeliveryApp.git\n```\n7. Push code on Github\n```\ngit push origin main\n```\n## Step 2: Deploy Your App\n1. Run the deploy command:\n```bash\nnpm run deploy\n```\nThis command will build your app and push the contents of the dist folder to the gh-pages branch of your repository.\n### Step 3: Access Your Deployed App\n1. Open your browser and navigate to\n```bash\nnpm run deploy\n```\n\n\nThis command will build your app and push the contents of the dist folder to the gh-pages branch of your repository.\n\n## Step 6: Access Your Deployed App\nOpen your browser and navigate to:\nhttps://github.com/\u003cUser_name\u003e/QuickShipApp\n\nDocumentation Links\n\nFor more detailed information, you can refer to the official documentation:\n\n[[Vite Deployment Guide](https://react.dev/learn)](https://v3.vitejs.dev/guide/)\n\n## Host Your Project On vercel \n1. Go to the Vercel website.\n2. Click on the \"Sign Up\" button and create an account using GitHub, \n3. Select The repositiory and Import it \n4. and after this Deploy it \n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fguptaravimp%2Fquickshipapp","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fguptaravimp%2Fquickshipapp","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fguptaravimp%2Fquickshipapp/lists"}