Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/yasinatesim/facebook-album-downloader
This project is s simple web application that allows users to download Facebook albums in full resolution
https://github.com/yasinatesim/facebook-album-downloader
album-downloader facebook facebook-album nextjs puppeteer typescript typescript-react
Last synced: 12 days ago
JSON representation
This project is s simple web application that allows users to download Facebook albums in full resolution
- Host: GitHub
- URL: https://github.com/yasinatesim/facebook-album-downloader
- Owner: yasinatesim
- License: mit
- Created: 2023-03-26T14:40:22.000Z (over 1 year ago)
- Default Branch: master
- Last Pushed: 2024-04-30T09:06:58.000Z (7 months ago)
- Last Synced: 2024-10-24T07:39:23.268Z (21 days ago)
- Topics: album-downloader, facebook, facebook-album, nextjs, puppeteer, typescript, typescript-react
- Language: TypeScript
- Homepage:
- Size: 93.8 KB
- Stars: 14
- Watchers: 2
- Forks: 4
- Open Issues: 4
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
Facebook Album Downloader
A simple web application that allows users to download Facebook albums in full resolution.
ยท Report Bug
ยท Request Feature## ๐ About
Facebook Album Downloader is a web application that allows users to download Facebook photo albums in full resolution. Simply enter the link to the album you want to download, and the application will create a ZIP archive containing all photos from the album.
### ๐ Tech Stack
Puppeteer
A Node library for controlling headless Chrome or Chromium browsersAxios
A promise-based HTTP client for the browser and Node.jsJSZip
A JavaScript library for creating, reading, and editing ZIP archives
Next.js
The React Framework for SEO Friendly website and more...
React
A JavaScript library for building user interfaces
skratchdot/react-github-corner
Add a Github banner to your project page for React
Commitlint
Send commit messages to conventional commits rules
TypeScript
TypeScript is a strongly typed programming language that builds on JavaScript, giving you better tooling at any scale.
SASS
The most mature, stable, and powerful professional grade CSS extension language in the world
Editorconfig
Helps maintain consistent coding styles for my working on the same project across various editors and IDEs
Eslint
Find and fix problems in your JavaScript code
Prettier
An opinionated code formatter
## ๐ง What's inside?
### Features
The main feature of this application is to allow users to download Facebook albums after entering the album link. When users enter a Facebook album link and click the "download" button, the application uses a tool called Puppeteer to scrape the HTML of the album and then presents these files as a downloadable ZIP file. Additionally, the application also includes a feature that warns the user if they are leaving the page while the download process may not have been completed yet.
## Structure
- `pages` - Contains top-level pages of the application.
- `api` - Contains serverless API endpoints.
- `download.ts` - Downloads a Facebook album using Puppeteer to scrape the HTML.
- `index.tsx` - Renders the root component into the DOM.The `src` directory contains the following:
- `styles` - Contains global styles.
`global.scss` - Global SCSS stylesheet.
- `containers`
- `Home` - Contains the main component of the application.
- `Home.module.scss` - Local SCSS stylesheet for the Home component.
- `Home.tsx` - Renders a form that allows users to input a Facebook album link and start downloading it.
- `Hooks`
`index.ts` - Exports all custom hooks.
`useBeforeUnload.ts` - Provides a hook that warns the user before leaving the page if a download is in progress.## Getting Started
### ๐ฆ Prerequisites
- Node (v17.0.0+)
- Npm (v8.1.0+)
### โ๏ธ How To Use
1. Clone this repository
```bash
git clone https://github.com/yasinatesim/facebook-album-downloader.git
```2. Install the project dependencies
```bash
yarn install
```**For Development**
```bash
yarn dev
```### For Docker
2. Change the directory
```bash
cd facebook-album-downloader
```3. Rename .env.example file to .env
4. Run this command **without `yarn` or `yarn install`**
```bash
yarn setup
```or
```bash
yarn && docker-compose up --build# or
# For Build
docker build -t facebook-album-downloader .# For Run
docker run -p 3000:3000 facebook-album-downloader
```App is running on [http://localhost:3000](http://localhost:3000)
**For Production Build & Build Start**
```bash
yarn build
```and
```bash
yarn start
```**For Lint & Format**
```bash
yarn lint
yarn format
```## ๐ License
- Copyright ยฉ 2023 - MIT License.
See [LICENSE](https://github.com/yasinatesim/facebook-album-downloader/blob/main/LICENSE) for more information.
---
_This README was generated with by [markdown-manager](https://github.com/yasinatesim/markdown-manager)_ ๐ฅฒ