{"id":20805878,"url":"https://github.com/rubenvar/csv-reader","last_synced_at":"2025-07-02T06:38:51.105Z","repository":{"id":53541489,"uuid":"163316224","full_name":"rubenvar/csv-reader","owner":"rubenvar","description":"A browser extension that transforms csv into a readable table, in the same tab","archived":false,"fork":false,"pushed_at":"2025-02-16T15:34:26.000Z","size":1968,"stargazers_count":22,"open_issues_count":7,"forks_count":3,"subscribers_count":3,"default_branch":"main","last_synced_at":"2025-03-31T06:21:50.781Z","etag":null,"topics":["chrome","chrome-extension","csv","csv-data","csv-reader","firefox","firefox-extension","html-table","transform-data"],"latest_commit_sha":null,"homepage":"https://chrome.google.com/webstore/detail/csv-reader/dnioinfbhmclclfdbcnlfgbojdpdicde","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/rubenvar.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","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":"2018-12-27T16:39:43.000Z","updated_at":"2024-10-07T16:00:37.000Z","dependencies_parsed_at":"2025-02-16T16:28:09.897Z","dependency_job_id":"f36173c4-3635-4878-bd4e-b33ea2524723","html_url":"https://github.com/rubenvar/csv-reader","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rubenvar%2Fcsv-reader","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rubenvar%2Fcsv-reader/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rubenvar%2Fcsv-reader/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rubenvar%2Fcsv-reader/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/rubenvar","download_url":"https://codeload.github.com/rubenvar/csv-reader/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":252811259,"owners_count":21807914,"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":["chrome","chrome-extension","csv","csv-data","csv-reader","firefox","firefox-extension","html-table","transform-data"],"created_at":"2024-11-17T19:16:51.873Z","updated_at":"2025-05-07T04:23:38.185Z","avatar_url":"https://github.com/rubenvar.png","language":"JavaScript","readme":"\u003cp align=\"center\"\u003e\n   \u003cimg width=\"630\" height=\"405\" src=\"/docs/promo.png\" alt=\"CSV Reader\"\u003e\n\u003c/p\u003e\n\n## What is this?\n\nA browser extension with 3.5k+ users.\n\nIt transforms raw `csv` data into a simple `html` table, and shows it online in the same tab.\n\nAvailable free for [Chrome](https://chrome.google.com/webstore/detail/csv-reader/dnioinfbhmclclfdbcnlfgbojdpdicde) and [Firefox](https://addons.mozilla.org/en-US/firefox/addon/csv-reader/).\n\n### What problem does this solve?\n\nWhen quickly looking through csv data files online, you either have to:\n\n- Open them with Excel, Numbers, etc.\n- Try to skim through the data in its raw state.\n\nCSV Reader allows you to look at the data formatted as a table, so you can make decisions faster.\n\n## Features\n\nCSV Reader detects if the current tab is a `.csv` page (correctly most of the time).\n\nThe user can select some settings in a popup to modify the output.\n\n**NEW**: The extension now stores user settings per url for the next time you browse the same file.\n\n**NEW**: The extension now stops `csv` files from downloading (it modifies the response headers) so you can parse them in-browser. If you want to download the file just `ctrl+s` (`cmd+s`), even in the parsed `csv` screen.\n\n### Output\n\nIt offers different options (see images and examples below):\n\n- Transform the raw `csv` data into a table, nicely formatted so it's easy to scan.\n- Keep the raw `csv` data but rainbow-color it to make it easier to read (inspired by the [Rainbow CSV VS Code extension](https://github.com/mechatroner/vscode_rainbow_csv)).\n- Download the data formatted as JSON (when there is a data header – title row).\n\n### Input\n\nIt allows the user to input some settings:\n\n| Feature         | Default | Type    | Result                                             |\n| --------------- | ------- | ------- | -------------------------------------------------- |\n| Separator       | `,`     | String  | New column when this value is found                |\n| Title row       | `false` | Boolean | Use the first line as the table header             |\n| Skip at the top | `0`     | Number  | Number of text lines to leave untouched at the top |\n| Links in text   | `false` | Boolean | Look for links in data and make them clickable     |\n\n## How to use\n\n1. Install the extension (in [Chrome](https://chrome.google.com/webstore/detail/csv-reader/dnioinfbhmclclfdbcnlfgbojdpdicde) or [Firefox](https://addons.mozilla.org/en-US/firefox/addon/csv-reader/)).\n2. Head to any `.csv` data page.\n3. Click on the extension icon, fill the form:\n   1. Choose the **separator**.\n   2. Check if there is a **title row** for the data. This will format a header row in the table.\n   3. Input the number of **lines to skip** at the top. Some csv pages have a few lines with info, we don't want to format those.\n   4. Check if there are **links** in the data. They will be formatted as clickable links.\n4. Click the appropriate button.\n5. Done, enjoy the result!\n\n### Example\n\nVisit a `.csv` data file online. You can try [this csv sample dataset](https://rubenvara.s3-eu-west-1.amazonaws.com/csv/dataNov-2-2020.csv).\n\nClick on the **CSV Reader** extension icon.\n\nIn the popup, input the config options: separator, title row, etc. (In the example dataset, `|` (pipe) as the separator, and check the title line option).\n\n![Start](/docs/init.png)\n\nClick \"Convert\":\n\n![Converted](/docs/table.png)\n\nTo go back to the raw data, click the \"Reset\" button on the extension popup:\n\n![Reset](/docs/reset.png)\n\n## Help this project\n\nIf this extension was useful to you in any way, please consider leaving a ⭐ 5-star review.\n\nIt will take you less than a minute, and will greatly help reach new audiences.\n\n- [Leave a review in Chrome](https://chrome.google.com/webstore/detail/csv-reader/dnioinfbhmclclfdbcnlfgbojdpdicde).\n- [Leave a review in Firefox](https://addons.mozilla.org/en-US/firefox/addon/csv-reader/).\n\nThank you very much!\n\n### Contribute\n\nSuggestions and PRs are welcome, of course. This is (_roughly_) the dev process:\n\n`extension/content_scripts/csv_reader.js` contains all the parse and output logic. The `browser.tabs` queries use Promises, supported in Firefox but not in Chrome, so the extension loads a polyfill for this.\n\n`extension/popup/popup.js` manages the user input logic, messaging to the main content script, and custom CSS inserts.\n\nTo load the unpacked, test extension:\n\n- In Chrome, load the whole unpacked `extension/` folder. Make sure the polyfill is in `extension/polyfills/`.\n- In Firefox, I use Mozilla's [web-ext](https://extensionworkshop.com/documentation/develop/getting-started-with-web-ext/) tool.\n\nTo build and pack the extension, I use `web-ext` too. It builds the `extension` folder and creates a `.zip` file inside `extension/web-ext-artifacts`.\n\nThat's it, there is no further compiling or building process, for now at least.\n\n## Some kind of roadmap\n\nSome features I'd like to work on (help appreciated):\n\n- [ ] Show **progress**: while the content is being processed, hide the raw csv and show a loading component.\n- [ ] Add a **reset** button directly in the page header.\n- [x] Stop `.csv` files from **downloading**, and instead open them in browser so thay can be converted.\n- [x] Store user config (per url) so they don't have to input the same fields every time.\n- [ ] Add a link to download .csv file in the page header.\n- [ ] Try to **auto-detect** separator.\n- [ ] Make columns **hideable**.\n- [ ] Make table sortable by column.\n- [ ] Detect if text _looks like a link_ instead of having a popup checkbox.\n\n## Acknowledgments\n\nCSV Reader uses `svg` icons from [Tabler Icons](https://github.com/tabler/tabler-icons), thanks!\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frubenvar%2Fcsv-reader","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Frubenvar%2Fcsv-reader","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frubenvar%2Fcsv-reader/lists"}