socialsole

所属分类:JavaScript/JQuery
开发工具:JavaScript
文件大小:0KB
下载次数:0
上传日期:2023-07-31 18:44:49
上 传 者sh-1993
说明:  这是一个非常简单的虚构社交媒体网站,使用基于对运动鞋的热爱的MERN堆栈构建。它有一个模拟新闻区...,
(This is a very simple fictional social media site, built with the MERN stack based around the love of sneakers. It has a mock news section with articles, about this topic. And users can register post,and share their sneaker collection.)

文件列表:
.slugignore (31, 2023-08-16)
.vscode/ (0, 2023-08-16)
.vscode/settings.json (221, 2023-08-16)
client/ (0, 2023-08-16)
client/extras/ (0, 2023-08-16)
client/extras/cloudWigetThemes.js (2085, 2023-08-16)
client/jsconfig.json (146, 2023-08-16)
client/package.json (1317, 2023-08-16)
client/postcss.config.js (119, 2023-08-16)
client/public/ (0, 2023-08-16)
client/public/assets/ (0, 2023-08-16)
client/public/assets/fonts/ (0, 2023-08-16)
client/public/assets/fonts/ClearSans-Bold.woff (58652, 2023-08-16)
client/public/assets/fonts/ClearSans-Bold.woff2 (44308, 2023-08-16)
client/public/assets/fonts/ClearSans.woff (59120, 2023-08-16)
client/public/assets/fonts/ClearSans.woff2 (44632, 2023-08-16)
client/public/assets/fonts/DejaVuSans-Bold.woff (327092, 2023-08-16)
client/public/assets/fonts/DejaVuSans-Bold.woff2 (223168, 2023-08-16)
client/public/assets/fonts/DejaVuSans.woff (351556, 2023-08-16)
client/public/assets/fonts/DejaVuSans.woff2 (242108, 2023-08-16)
client/public/assets/fonts/DejaVuSansCondensed-Bold.woff (304488, 2023-08-16)
client/public/assets/fonts/DejaVuSansCondensed-Bold.woff2 (208376, 2023-08-16)
client/public/assets/fonts/FjallaOne-Regular.woff (23296, 2023-08-16)
client/public/assets/fonts/FjallaOne-Regular.woff2 (18740, 2023-08-16)
client/public/assets/fonts/demo.html (14612, 2023-08-16)
client/public/assets/fonts/stylesheet.css (1223, 2023-08-16)
client/public/assets/img/ (0, 2023-08-16)
client/public/assets/img/$_57.jpg (191227, 2023-08-16)
client/public/assets/img/0a5c4b5cfa6d5b8e8da03c852fb26d2d.jpg (75695, 2023-08-16)
client/public/assets/img/0e0389675fa14a7e928b7bab11d1b2c1.jpg (12917, 2023-08-16)
client/public/assets/img/134216-48.png (377, 2023-08-16)
client/public/assets/img/14a10610fa32af62ab5ca387eb8adb51.jpg (127951, 2023-08-16)
client/public/assets/img/2019-New-Brand-Cool-Shoes-Men-Spring-Autumn-Comfortable-Casual-Mens-Shoes-Breathable-Loafers-Fashion-Mens.webp (172878, 2023-08-16)
client/public/assets/img/2ad8eb303e48aeb9255c57138543dbf3.jpg (94067, 2023-08-16)
client/public/assets/img/3738c3e05caf01d0f18336fd724647cd.jpg (198538, 2023-08-16)
client/public/assets/img/50dd2016b86b87107406289ad5bcd115.jpg (35926, 2023-08-16)
client/public/assets/img/61b93104b2e0ed70c2caec9b3a460fad.webp (76462, 2023-08-16)
client/public/assets/img/66a4d28a40295ccc7511507f2949a5d1.jpg (67615, 2023-08-16)
client/public/assets/img/865f796de66d23da05e87a0fea88b3c0.jpg (157731, 2023-08-16)
... ...

![Markdown Logo](https://github.com/githubphotos/2023-update/HD/Home-pg-header.jpg) | | | | -------- | -------------- | | ![Markdown Logo](https://github.com/githubphotos/2023-update/HD/Front-latest-news.jpg)| ![Markdown Logo](https://github.com/githubphotos/2023-update/HD/Article-section.jpg)| | ![Markdown Logo](https://github.com/githubphotos/2023-update/HD/Sneaker-pg.jpg)| ![Markdown Logo](https://github.com/githubphotos/2023-update/HD/Sneaker-detail.jpg)| | ![Markdown Logo](https://github.com/githubphotos/2023-update/HD/Dashboard-pg-saved-content.jpg)| ![Markdown Logo](https://github.com/githubphotos/2023-update/HD/Posts-detail.jpg)| | ![Markdown Logo](https://github.com/githubphotos/2023-update/HD/Article-detail.jpg)| ![Markdown Logo](https://github.com/githubphotos/2023-update/HD/Search-results.jpg)| # SocialSole - A Sneaker Enthusiast Social Media Site SocialSole is a fictional social media site built with the MERN stack, centered around the passion for sneakers. The site features a mock news section with articles related to sneakers, and users can register, post, and share their sneaker collections in the community section. ## I've implemented some significant updates to SocialSole. Here's what's new: 1. Complete Site Redesign: SocialSole now sports a modern and sleek design, enhancing the overall user experience. 2. Revamped Navbar Component: The Navbar has been redesigned for improved navigation and ease of use. 3. Realtime Search Overlay: Users can now perform searches in real-time through a dynamic overlay, providing quick and relevant results. 4. Redesigned Articles Section: The Articles section has been refined with a cleaner and more polished look. 5. Enhanced User Dashboard: The user dashboard has received some significant additions: * Timeline: Users can now view not only their content but also posts from users they follow, keeping them up-to-date with their network's activities. * Centralized Comment View: All user comments are conveniently accessible in one place. * Liked Content Collection: Users can access all content they have liked, making it simple to revisit their favorites. * Custom Lists: Users can now create and manage custom lists, allowing them to save articles, posts, and sneakers for future reference. 6. Admins can handpick and feature specific posts, sneakers, and articles, showcasing them prominently in their respective sections. ## Getting Started To get started clone or download the repository. Run npm install to install the necessary dependencies, for the server side. Then CD into the client folder and repeat the same step for the client side. This project uses MongoDB for its database needs, so you can use a localized version, or signup for a free **[Mongo Atlas](https://github.comhttps://www.mongodb.com/ "MongoDB")** account and store your database in the cloud. In the config folder you will see a file called Keys_dev-sample.js, rename it to Keys_dev.js. And place your Mongo Uri, and secret keys in there. This project also uses the Cloudinary Widget for uploading and storage of media files, so it would necessary to sign up for free account here --> **[Cloudinary](https://github.comhttps://cloudinary.com/users/register/free/ "Cloudinary")**. When you signup you will be given a **cloudname** which is a string. You will also need an upload present which is also a string. To get this, after you sign up and log in you will be directed to the cloudinary console page. Click on the settings icon top right. Then scroll down until you see this section referenced in the picture below. ![alt text](https://github.com/githubphotos/cloudinary-console.jpg) After you obtain both you then want to look for the .env-sample file in the client folder. Paste both the cloudname, and upload present, then rename .env-sample to .env, then you are all set to use the Cloudinary Upload Widget. To test out some of the features above without having to create your own data from scratch you can use the included sample data to start with. There two ways you can do this. #### First way : * create a MongoDB database either in the cloud or on your computer * If you have MongoDB installed on your computer navigate to the **Tools\100\bin** folder inside your MongoDB folder in a CMD prompt. You may need to have admin privileges. * When you are pointing to this directory paste this command `.\mongorestore --uri="mongodb+srv://:<"your newly created database uri">" --dir="<"absolute path on your cpu">\sample_data\backup-db"`

What you're doing is getting the included sample data from <"absolute path on your cpu">sample_data\backup-db that is included in this repository and copying all the data to your brand new database. ### Second way : Seed your database using the included seeder.js file in the utils folder. This file uses sample data contained in the data folder, to seed data. To perform this step. Run: ``` npm run data:import ``` To clear all the data in your database run: ``` npm run data:destroy ``` ## SocialSole was built using the following technologies: * Node.js * React.js * Express * MongoDB * Cloudinary

近期下载者

相关文件


收藏者