devvsakib / power-the-web Goto Github PK

we need an TODO projects. Please create a todo list app and push it into "PROJECTS" folder.

don't miss hacktoberfest!!!

add a simple react counter app.

increase and decrease count. should be count > 0,
count !=0 or count<0

Navigate to the folder

Check 2nd Branch, name- convert-react
Clone this, and navigate to main-website folder, this is the main website we are converting into react website after you have done, PR to the convert-react branch, not in the "main" branch. Add your details to contributors.json file.

Feature?

Hide the scrollbar, it looks disgusting. do not use overflow hidden,

Bug?

Describe here

Task:
hide scrollbar for the body.
write CSS in main.css file to apply to the entire website
body::-webkit-scrollbar{
display: none
}
this CSS for chrome, write for IE, Edge and Firefox too

You can join our discord server - let's build together Join

Navigate to the folder

Check 2nd Branch, name- convert-react
Clone this, and navigate to main-website folder, this is the main website we are converting into react website after you have done, PR to the convert-react branch, not in the "main" branch. Add your details to contributors.json file.

Feature?

NO

Bug?

Website reloading while we navigate the menu, it shouldn't. check if you are able to solve this bug.

Task:
clone this repo, checkout to convert-react branch, and work on the navbar!

Expected behavior:

website shouldn't reload while navigating from one page to another page. But Logo working fine.

You can join our discord server - let's build together Join

add a ROADMAP page.
and link to every page

You can join our discord server - let's build together Join

Navigate to the folder

Check 2nd Branch, name- convert-react
Clone this, and navigate to main-website folder, this is the main website we are converting into react website after you have done, PR to the convert-react branch, not in the "main" branch. Add your details to contributors.json file.

Feature?

Add a Bottom to Top scroll button
it's hard to scroll when you are on mobile device, so please add a Bottom to Top button with an arrow icon

Bug?

NO

Task:
add button here
Desktop version position:

Mobile version position:

please make sure, it only shows if you scroll down. otherwise, it won't show.

You can join our discord server - let's build together Join

create blog card to show blog

Navigate to the folder

Check 2nd Branch, name- convert-react
Clone this, and navigate to main-website folder, this is the main website we are converting into react website after you have done, PR to the convert-react branch, not in the "main" branch. Add your details to contributors.json file.

Feature

Update hero section

Bug?

Describe here

Task:
Describe task

You can join our discord server - let's build together Join

So far we all did fantactic, its time to improve our website design. if you have any design idea please let us know, we will assign you and label your pr as Hacktoberfest

We need to store our contributors details in a json file.

{
  "profiles": [
    {
      "name": "DevvSakib",
      "avatarUrl": "https://avatars.githubusercontent.com/u/88339569?v=4",
      "github": "devvsakib",
      "twitter": "devvsakib"
    }
 ]
}

if they don't have twitter, you can skip - "twitter": " "

Major Update

So far we did well. Now its time to convert our website into react website.

Now we are using simple html css static website. But we are going to convert this into react.

Please comment only if you have exprience

add your blog to showcase

we need a FAQ page with accordion.

use random questions and answer, later we will change it
sample:

please solve this problem, card should be inline.

use flex in ul tag to resolve

build a simple Quiz Application with react and add it to 'PROJECTS' folder.

Its a good practice for beginners, so lets smash it.

Can I make an uber-cloned website?
Please assign me this issue

Feature Idea

So far everything going well. But now we have to add something really cool. If you have any idea or suggestion please comment here.

Already Have ReactJs projects?

If you already have project, then you can add your project in PROJECTS folder and don't forget to comment out your github username and link in your project file

Thank You, Hope for Best

Navigate to the folder

Check 2nd Branch, name- convert-react
Clone this, and navigate to main-website folder, this is the main website we are converting into react website after you have done, PR to the convert-react branch, not in the "main" branch. Add your details to contributors.json file.

Feature?

NO

Bug?

Mobile menu not navigating the page

Task:
Figure out why menu not working on mobile device.

You can join our discord server - let's build together Join

Navigate to the folder

Check 2nd Branch, name- convert-react
Clone this, and navigate to main-website folder, this is the main website we are converting into react website after you have done, PR to the convert-react branch, not in the "main" branch. Add your details to contributors.json file.

Feature?

We need a roadmap page for the guidline.

Bug?

Describe here

Task:
Create a page named roadmap, and link to nav

You can join our discord server - let's build together Join

Check 2nd Branch, name- convert-react
Clone this, navigate to main-website folder,this is our main website we are converting into react website,

Task:
Just create a simple footer like that -

You can join our discord server - lets build together Join

please add a footer,
footer text "PowerTheWeb | Developed By PTW Community @ 2022"

HACKTOBERFEST is almost about to end, don't be late, just PR your react app to participate hacktoberfest.

add your projects to "PROJECTS" folder
Good Luck,
Always welcome to our family DISCORD JOIN

So far we have our contributors json file, its time to fetch them to our contributors.html file.
Please comment if you have better knowledge about fetch or map functions

Todo:
create a script.js file,
fetch all json data to contributors page

make pr, hacktoberfest label will be added

add some suggestions, guideline to roadmap page

title: frontend
sub title: frontend roadmap

It is essential to make folder clean. Create a assets folder and move all the style and script file to it

Dont forget to link them

PR your projects to "PROJECTS" folder and get accepted by hacktoberfest.
I will label your PR as hacktoberfest.
PR as much as you want, unlimited assign to this issue. don't forget to add your copyright to your projects Footer

add a proper guide in readme file

Feature?

Update the readme file with these screenshots

Bug?

No

Task:
add those screenshots in assets folder.
Just delete this screenshot

and add those 2 screenshots here

and delete this line, add "PowerTheWeb is an open-source project to help web developers make their road easy to become a successful web developer"

You can join our discord server - let's build together Join

add a simple contributor page.
design concept:

• circle image,
• full name,
• Twitter, GitHub link icon.

3/4 profile in a row

currently mobile navbar are broken. please it responsive.

Navigate to the folder

Check 2nd Branch, name- convert-react
Clone this, and navigate to main-website folder, this is the main website we are converting into react website after you have done, PR to the convert-react branch, not in the "main" branch. Add your details to contributors.json file.

Bug?

Menu not showing when we click on icon

Task:
Manu should show and hide when we click

You can join our discord server - let's build together Join

We need a blog page in our website. With Blog page, we can showcase our contributors post/blog.

Details

• creat blog page
• add nav
• add demo blog card (design as you wish)

Please comment if you want to assign here.

Contributors' tab

Projects' tab

We need to add our contributor page, where we can showcase our all contributor.

Please

1. create a contributor.html
2. add nav
3. link to index.html

assign to get Hacktoberfest label

We already have so many projects collected from our contributors.
So, we need a project's HTML file and list all the project's names from the "PROJECTS" folder.

1. create project.html
2. add link to index file
3. add main navbar
4. create a table to put all the projects name

for now, its ok

Navigate to folder
Check 2nd Branch, name- convert-react
Clone this, navigate to main-website folder,this is our main website we are converting into react website,

Feature?

No

Bug?

No

Task:
Delete PROJECTS folder. we will add projects later, though we have "main" branch with "PROJECTS" folder so we don't need to have it in our "convert-react" branch. Please be aware, and make pr to convert-react branch

You can join our discord server - let's build together Join

please create contributors profile card on contributors.html file

sample design:

add title "CONTRIBUTORS"

Navigate to folder

Check 2nd Branch, name- convert-react
Clone this, and navigate to main-website folder, this is the main website we are converting into react website after you have done, PR to convert-react branch, not in the "main" branch. Add your details to contributors.json file.

Feature?

add contributors card

Bug?

No

Task:
We have contributors card design, go there
add this card to contributors page

You can join our discord server - let's build together Join

add your projects to projects folder

Navigate to folder
Check 2nd Branch, name- convert-react
Clone this, and navigate to main-website folder, this is the main website we are converting into react website after you have done, PR to convet-react branch, not in the main branch. Add your details to contributors.json file.

Feature?

Mobile navbar not responsive, make its responsive and add hamburger menu icon for mobile device

Bug?

NO

Task:
Navbar file has everything you need, in 43line delete the "hidden" class to see the hamburger menu icon,

You can join our discord server - lets build together Join

Hi, right now we have a static and normal HTML website. But, it's time to go higher. We are thinking to develop this open-source website into a dynamic react js website.
For this, I will be helpful if you collaborate with me. We will convert our work between us. For example, if I want to create a navbar, I will work on the header components, and you will work on the desired component you want.

So basically, anyone can be assigned to this issue. There is no limit.

Requirement

Have to good understanding of JavaScript, ReactJs (no need professional, just know how react works and some knowledge about react components), Tailwind CSS, react styled-components.

That's it...!!!

You can join discord - JOIN

add a simple roadmap page to the website

It would be great if the projects were categorized by language or if the users could find them using tags like "React," "Django," "Angular," etc.
Users can then easily find projects based on their stack.

Describe the bug
The footer text is not center aligned. you can align it center and get green square

To Reproduce
Steps to reproduce the behavior:
go to footer components and add text-center

Expected behavior

Screenshots
null

Smartphone (please complete the following information):

• Device: Any Mobile
• Browser : Any

add a roadmap page and link to the navbar.
add some frontend guideline

Is your feature request related to a problem? Please describe.
some files and folders are not necessary, So delete them,

Describe the solution you'd like
delete unnecessary file/folders. Please be careful when you delete a file/folder

we need to strore all our contributors details
Name
Profile Picture
GitHub link
file name: contriutors.json

demo

{
  "profiles": [
    {
      "name": "DevvSakib",
      "avatarUrl": "https://avatars.githubusercontent.com/u/88339569?v=4",
      "github": "devvsakib",
      "twitter": "devvsakib"
    }
 ]
}

for avatar, goto user profile, right click on image, COPY IMAGE LINK. that's it
twitter is optional, you can add your

If you ever cloned any well-known website like amazon, netflix, tesla, disney, spotify. you can PR your projects

adding project:
add your projects in "PROJECTS" folder
hacktoberfest label will be added