Web3Collectives

Project Overview

Web3Collectives is a comprehensive, curated collection of resources designed to help individuals understand how blockchain technology works and the underlying concepts that drive it. It is a carefully curated collection of free learning resources focused on blockchain and Web3 development. It offers free access to various learning materials, including interactive tutorials, how-to guides, courses, books, documentation, and videos.

This platform data relies on the awesome repository https://github.com/frankiefab100/Blockchain-Development-Resourcesof over 130 resources tailored for Web3 enthusiasts eager to learn about and build smart contracts on various blockchain networks to make Web3 education accessible to everyone, particularly beginners and non-developers.

Technologies

• Frameworks/Libraries: ReactJS, React Router

• Styling: CSS

• Form Management: Formspree

• Deployment: Vercel

• Email Integration: ConvertKit

Features

• User-Friendly Navigation: Easy access to various categories of resources, including Websites, YouTube Channels, Development Tools, Online Courses, Interactive Tutorials, Documentation, GitHub Repositories, Project Starter Templates, Node Providers, Blogs, and Books.

• Experience Levels: Resources are categorized by experience level (Beginner, Intermediate, Advanced) to cater to different users.

• Search Functionality: Find resources by entering keywords related to tutorials, guides, GitHub repositories, videos, etc.

• Categorized Resources: Navigate through various categories such as websites, YouTube channels, interactive tutorials, development tools, and more.

• Advanced Filtering: Tailor your learning experience by filtering resources based on experience levels (beginner, intermediate, advanced).

• Sorting Options: Sort resources by date added or alphabetically for easy access to desired content.

• Scroll Indicator: A helpful scroll indicator keeps users oriented while navigating the website.

• Dark Mode: Users can switch between light and dark modes for a visually appealing browsing experience.

Development Process

The development of Web3Collectives involved several key steps:

• Inspiration and Conceptualization: The idea for this project emerged from my previous work curating in a GitHub repository. Recognizing the need for a more accessible platform for Web3 education led to the creation of Web3Collectives.

• Implementation: Using ReactJS and Vite allowed for efficient development. I integrated Formspree for form management and deployed the project on Vercel.

• Resource Organization: Resource items are stored in JSON (JavaScript Object Notation) format, grouped by categories to facilitate easy retrieval and navigation.

Challenges

Throughout the development of Web3Collectives, I faced several challenges:

• Resource Curation: Ensuring all listed resources were accurate, up-to-date, and valuable required thorough vetting and continuous updates.

• User Experience Design: Designing an intuitive interface that effectively categorizes and presents a vast amount of information was a complex task but ultimately rewarding.

• Data Storage Pattern/Schema: As a frontend developer with limited backend experience, determining the most suitable data storage pattern was challenging. After research, I opted for JSON formatting to categorize learning resources effectively.

• Email Subscription Integration: Initially attempting to use MailChimp for email subscriptions proved complex; I eventually switched to ConvertKit for a more streamlined solution.

Achievements

Building Web3Collectives was a rewarding experience that deepened my understanding of React and exposed me to diverse technologies and problem-solving opportunities.

Key Takeaways:

• Accessibility: I learned the importance of curating high-quality educational materials and creating an accessible platform that reduces barriers to entry for individuals interested in Web3 technologies.

• Hands-On Experience: I gained practical experience integrating various libraries, such as ConvertKit for email services and Formspree for submission forms without backend complexities.

Milestone: This project has amassed over 90 upvotes, earning the number 1 spot for Web3 Product of the Week. It also features minimalistic markdown documentation site: https://blockchain-development-resources.netlify.app ,which has received over 1.3k stars.