RSG-Spain Archiva2

This repository hosts the RSG-Spain Scientific Communication Team posts from 2022-2025, featuring "Bioinforma2" and "BioinfoComms". The website is designed to be interactive, scalable, and self-updating.

🚀 How It Works

The website uses a GitHub Actions workflow to automatically update whenever you add new content. You do not need to edit HTML or JavaScript to add new posts, just upload the folder containing the images of the post to the Bioinforma2/ or BioinfoComms/ directory.

📂 Adding New Posts

1. Prepare your content: Create a folder for your post. Inside, place your images named sequentially (e.g., 1.png, 2.png, 3.png...). The first image (1.png) will be used as the cover. This folder can be downloaded directly from Canva. The required structure of the folder is as follows:

   YYYY-MM-DD Title
   ├── 1.png
   ├── 2.png
   ├── 3.png
   └── ...
   

2. Choose the category:
   • For educational content, drag your folder into Bioinforma2/.
   • For divulgation content, drag your folder into BioinfoComms/.
3. Upload to GitHub: Commit and push your changes to the main branch.

That's it!

The automated workflow will:

1. Detect the new files.
2. Run a script to scan the directories.
3. Update the posts.json database.
4. Re-deploy the website with the new content.

Note: The process usually takes 1-2 minutes to complete.

💻 Local Development

Because the website loads data dynamically (to support automation), you cannot simply open the index.html file in your browser. You must run a local server.

1. Open your terminal in the project directory.

2. Run the following command:

   python3 -m http.server

3. Open your browser and go to: http://localhost:8000

🛠️ Technologies Used

• HTML5 & CSS3: Custom styling with CSS variables for easy theming.
• JavaScript (Vanilla): Logic for carousel, dynamic data loading, and transitions.
• Swiper.js: Third-party library for the 3D Coverflow carousel effect.
• Python: generate_posts.py script to scan directories and generate JSON data.
• GitHub Actions: CI/CD pipeline for automated updates and deployment.

📁 Project Structure

• Bioinforma2/: Directory for educational post folders.
• BioinfoComms/: Directory for divulgation post folders.
• index.html: Main entry point.
• style.css: All styling rules.
• script.js: Frontend logic (carousel, toggle, search).
• posts.json: Automatically generated data file (do not edit manually unless strictly necessary).
• generate_posts.py: The script that powers the automation.
• .github/workflows/update_content.yml: The automation configuration.

---

Made with ❤️ by the Scientific Communication Team (RSG-Spain)