GWGweb-projectgroup / practice-project

This practice project will enable members to test and hone front end development skills using a myriad of web technologies.
https://gwgweb-projectgroup.github.io/practice-project/
BSD 2-Clause "Simplified" License
14 stars 20 forks source link

Moving Forward #26

Closed chrisvneal closed 6 years ago

chrisvneal commented 6 years ago

What's up @GWGweb-projectgroup

Welcome @Cynth42!

We can all begin working on this project. The concept of the site is really simple and we can go over more as the week progresses, but we will be working on a mock e-commerce site.

Quick Notes

I'm so excited to start. Let's do this! 😃

darenjm commented 6 years ago

Good morning, this is exciting!

Daren Morreale WordPress Website Designer www.darenjm.com USA: (347) 467-1093 Colombia: +57 (321) 926-1600 - whatsapp skype: darenjm444

On Sun, Mar 11, 2018 at 3:20 AM, Chris Neal notifications@github.com wrote:

What's up @GWGweb-projectgroup https://github.com/gwgweb-projectgroup

Welcome @Cynth42 https://github.com/cynth42!

We can all begin working on this project. This concept of the site is really simple and we can go over more as the week progresses, but we will be working on a mock e-commerce site. Quick Notes

-

I included pictures https://github.com/GWGweb-projectgroup/practice-project/tree/master/img for the @GWGweb-projectgroup/layout https://github.com/orgs/GWGweb-projectgroup/teams/layout team and @GWGweb-projectgroup/index-html https://github.com/orgs/GWGweb-projectgroup/teams/index-html team to work on, but feel free to gather any new pictures you find from other sources

I included a Workflow.md file https://github.com/GWGweb-projectgroup/practice-project/blob/master/Workflow.md for any newcomers and for anyone else who needs to understand a basic GitHub collaboration workflow with this group specifically

Check out @elementWebDev https://github.com/elementwebdev's wireframes to help kickstart the main page! Thanks again for getting that crackin'. I'm learning Bootstrap as I do the project

Participate or leave the group

I'm so excited to start. Let's do this! 😃

— You are receiving this because you are on a team that was mentioned. Reply to this email directly, view it on GitHub https://github.com/GWGweb-projectgroup/practice-project/issues/26, or mute the thread https://github.com/notifications/unsubscribe-auth/AXO74wjT3rxofPb30Qz9hdHoSwKthSB6ks5tdN4zgaJpZM4Slmk2 .

Cynth42 commented 6 years ago

Hey Chris! This is great - We can do this! But Wireframe link is down; needs fixing.

chrisvneal commented 6 years ago

OK @Cynth42 I'll look into it thanks

elementWebDev commented 6 years ago

the link is wireframes/proto.png

elementWebDev commented 6 years ago

also img/home.png, img/products.png, img/product.png

chrisvneal commented 6 years ago

@Cynth42 which wireframe link are you referring to? The team name links work and I can view the .png file. Was it somewhere in the README?

Cynth42 commented 6 years ago

I clicked on the link right here in issue: Check out @elementWebDev's wireframes to help kickstart the main page! but it took me to a 404 page. I'll just look in .png file. Thanks!

chrisvneal commented 6 years ago

Hey @Cynth42 thanks for checking that, I just fixed it and added the link.

elementWebDev commented 6 years ago

Thanks Chris

Just an update, I'm working on a products page and waiting until i have something decent to commit.

chrisvneal commented 6 years ago

@elementWebDev thanks! Remember, ideas are welcome too. Don't feel that a feature has to be 100% done to commit!

elementWebDev commented 6 years ago

ok... how about this..

Create folder for each feature with its own files to be integrated in the root when finished -or- would it be better to have it all in one file to be dissected?

elementWebDev commented 6 years ago

i only ask because there were a whole bunch of commits while I was working on it lol

chrisvneal commented 6 years ago

@elementWebDev if you have a new feature that your working on that you aren't too sure you want to incorporate yet into the project (for example PHP/mySQL functionality, maybe another framework, etc.), create another branch for it on your local machine so you can also continue to work on the site with the regular stuff (Bootstrap classes, CSS, simple JavaScript) in your local [dev] branch.

So your local branches would look something like this:

typical branches we all work from

separate branches - (languages everyone may not know yet)

elementWebDev commented 6 years ago

I like that idea @chrisvneal

chrisvneal commented 6 years ago

@elementWebDev Looking over the code now, nice work! What I'll do is merge everything into the [dev] branch and pull it so I can see the site. Looks good to me, I don't see any issues so far. 👍

elementWebDev commented 6 years ago

Continuing the conversation from PR #41...

Since we're only doing 2-3 pages, I'm assuming we should have all products on one page in different sections. On Sale items either on the home or on top of products page?

Anyone else with ideas... please feel free to jump in 👍

anvarov commented 6 years ago

hello everyone, just wanted to know, how app will run (i mean server, database etc)? and do we have special requirements about that, for example when implementing user authorization, will we use any libraries if we do, what kind of?

p.s. I'm very sorry for my english, it is not my native language

elementWebDev commented 6 years ago

@anvarov we haven't gotten anything together like that as far as I'm aware, however if you are working on something of the sort... as @chrisvneal posted above ...

if you have a new feature that your working on that you aren't too sure you want to incorporate yet into the project (for example PHP/mySQL functionality, maybe another framework, etc.), create another branch for it on your local machine so you can also continue to work on the site with the regular stuff (Bootstrap classes, CSS, simple JavaScript) in your local [dev] branch.

So your local branches would look something like this:

typical branches we all work from

  • [master] - where you would pull the latest changes from the main repo

  • [dev] - where you make changes to be pushed back to your GitHub acct's [dev] branch to make the pull request to be reviewed

separate branches - (languages everyone may not know yet)

  • [php_idea] - to be pushed (when your ready), reviewed and merged

  • [ruby-idea] - to be pushed (when your ready), reviewed and merged

elementWebDev commented 6 years ago

products-info idea proposal

elementWebDev commented 6 years ago

I have uploaded the project to my site https://elementwebdev.com/gwg so we can see progress other than just code, I will try to keep this updated as changes come.

Cynth42 commented 6 years ago

@elementWebDev the idea proposal looks great! Okay- cool and You can also see progress made on the site by clicking on the index page.

chrisvneal commented 6 years ago

@elementWebDev

On Sale items either on the home or on top of products page?

I can see how the Sale items on the main page would work, like we see on most e-commerce pages.

I like the idea of having the content switch as you select different categories, would we need anything like Ajax for that? I imagine PHP alone could, I'm actually interested in learning that. If you can make that happen by all means.

If you have to remove any of the graphics I put there, please go ahead. I was thinking of a more professional look?


@anvarov

If you know some PHP or anything like that, go ahead and write some code in another branch like explained. I am interested in merging other technologies with this project as we see fit.

Think of this project as something to help "work the kinks out" and learn GitHub as well.

NOTE: Also, by the end of the week I'll be cleaning this place up a bit - sweep up the stagnant areas!

Cynth42 commented 6 years ago

Alright, so when a buyer goes on the site and clicks on a headphone, it should take him to the item's description and ultimately to add item to cart. How is the cart set up? Where can I find resources to write script for cart.js? Are you incorporating other languages like PHP and Ruby? What would be their purpose?

elementWebDev commented 6 years ago

@chrisvneal

The hero images look awesome! We'll have to work on the css breakpoints for mobile.

Some task ideas for those interested: manipulate the menu with jquery or vanilla .js

make a products.js in JSON that includes:

I want to try and avoid php if we can, other than if we do logins etc. However since this is a front-end starter project we could just go with PayPal which takes care of logins etc


@Cynth42 the cart isn't setup yet but you have the right idea for clicking on the image which shows the product larger and with a description as well as the add to cart button.

@GWGweb-projectgroup I think getting the html down as a template to be filled in by javascript is a good idea.

chrisvneal commented 6 years ago

@Cynth42 @elementWebDev

As far as the cart is concerned, whatever functionality you want to incorporate is fine. I want to be careful and not step into creating an actual, real store with logins, etc. I'd expect to hit a login link and just have a modal pop up, but that's as far as that would go. No need to incorporate a database or anything... with this project.

I haven't created too many JSON files, but I can learn. Is that necessary for this mockup? At this point, the focus is more on the front facing UI than anything (using HTML, CSS, Bootstrap, and some helpful JS scripting). Let's see how far we get with that and the next phase would be to either continue building out an advanced mockup of the e-commerce site or start another project incorporating more intermediate technologies such as JSON, Ruby, PHP, etc.

All great ideas!

elementWebDev commented 6 years ago

I agree. thanks for clearing that up. I think we're doing pretty good so far.

elementWebDev commented 6 years ago

no we dont have to do json.. but definately a good idea for use on larger projects

Cynth42 commented 6 years ago

I'm just waiting to see the HTML file for products, then the JS team can start working on products.js

elementWebDev commented 6 years ago

We need product images for:

elementWebDev commented 6 years ago

products-screenshot

What does everyone think?

elementWebDev commented 6 years ago

product-dropdown

This was more of what I had in mind

elementWebDev commented 6 years ago

oops the audio is supposed to be .hero-audio or similar naming not .hero-tech

also the order of categories should be the same as in the menu

elementWebDev commented 6 years ago

product transition transitions

Cynth42 commented 6 years ago

Hi guys! Thank you all for the great progress! I'll catch up over the weekend. I'm working on my student story that has to be submitted tomorrow(Friday).

chrisvneal commented 6 years ago

@Cynth42 Oh I forgot all about that!

chrisvneal commented 6 years ago

@elementWebDev Good thinking, way ahead! I fixed a lot of those issues and I did notice the link/menu arrangement. Also I'm just seeing these wireframe ideas for the first time.

chrisvneal commented 6 years ago

@elementWebDev If you get a chance, can you create another issue going over ideas for the site's interactive functionality. Looks like you have some good ideas. I'll go over them!

Edit: Since we only have the 4 sections, if you want up to start up new pages for those, by all means go ahead. It may be better to at least finish the majority of the page template so we can create other pages from that.

elementWebDev commented 6 years ago

sounds good.. lots to keep me busy :) i uploaded the master to my server before i saw the comments, and was a little confused..lol bit it all makes sense now :)

elementWebDev commented 6 years ago

sorry about the late wireframes, these ideas came to me as I was working on the project, and thought it would be easy to work around for others and share the proposal

ddpetty commented 6 years ago

Does anyone have ideas for the computers page? I'm binge coding on Sunday and I would like to stay consistent with other pages while adding a little CSS flair.

On Fri, Mar 16, 2018 at 2:25 PM, Ivan notifications@github.com wrote:

sorry about the late wireframes, these ideas came to me as I was working on the project, and thought it would be easy to work around for others and share the proposal

— You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub https://github.com/GWGweb-projectgroup/practice-project/issues/26#issuecomment-373803813, or mute the thread https://github.com/notifications/unsubscribe-auth/AYsNbuvr_kugiA91ewFWxgtHAyb1-J4jks5tfAOxgaJpZM4Slmk2 .

ddpetty commented 6 years ago

I work just under full time so I have to fit a ton of time when I can.

On Fri, Mar 16, 2018 at 3:46 PM, Dionne Petty dionne.petty@gmail.com wrote:

Does anyone have ideas for the computers page? I'm binge coding on Sunday and I would like to stay consistent with other pages while adding a little CSS flair.

On Fri, Mar 16, 2018 at 2:25 PM, Ivan notifications@github.com wrote:

sorry about the late wireframes, these ideas came to me as I was working on the project, and thought it would be easy to work around for others and share the proposal

— You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub https://github.com/GWGweb-projectgroup/practice-project/issues/26#issuecomment-373803813, or mute the thread https://github.com/notifications/unsubscribe-auth/AYsNbuvr_kugiA91ewFWxgtHAyb1-J4jks5tfAOxgaJpZM4Slmk2 .

chrisvneal commented 6 years ago

@ddpetty

Nothing to worry about, do what you can. In the meantime, I can look over your computers.html page as we build a template for any other category pages, nice page btw! I sectioned the CSS off for it in products.css, so we can look at that separately. Before you start your code binge, remember to pull the latest changes from this repo's [master] branch.

@elementWebDev

How do you like the design of the products page, is that something we can work with while including features from the wireframe above? I left the commented sections in products.html alone, what feature is that?

Also, I will help create content for the main page, index.html. If anyone has any ideas, let me know!

chrisvneal commented 6 years ago

@GWGweb-projectgroup

I added a Project Page for us whenever we get to the point where we're comfortable creating tasks in a project format. This project setup is built similar to the Trello app.

Also, tomorrow sometime when I get the chance, I'll be making some adjustments to the teams.

elementWebDev commented 6 years ago

I dont have much time this weekend, but I saw your ratings and will work on this to make it respond to input. I found a good tutorial to work with.

On Mar 17, 2018 12:53 AM, "Chris Neal" notifications@github.com wrote:

@GWGweb-projectgroup https://github.com/gwgweb-projectgroup

I added a Project Page https://github.com/GWGweb-projectgroup/practice-project/projects/2 for us whenever we get to the point where we're comfortable creating tasks in a project format. This project setup is built similar to the Trello app.

Also, tomorrow sometime when I get the chance, I'll be making some adjustments to the teams.

Cynth42 commented 6 years ago

Hey you all! Submitted student story- hope you all submitted yours! I pulled the latest changes to my local. See more html, css and js pages (onSale.html, audio.html, prroducts.css, styles.css, global_styles.css, product.js). Styling is mainly bootstrap? Looking at product.js

chrisvneal commented 6 years ago

@GWGweb-projectgroup

Hey @Cynth42

I submitted my story! I wasn't going to, but I had something to say at the last minute lol

As for Bootstrap, I figured since I wanted to learn it and @elementWebDev started out using the framework for the layout, it'd be good to work some of it into the project. I'm even considering using Bootstrap's carousel for the main page! Are you familiar with Bootstrap v4?

elementWebDev commented 6 years ago

@GWGweb-projectgroup

looks like I gotta catch up from the weekend, good job!

Bootstrap Carousel tutorials BS docs w3schools tutorial

elementWebDev commented 6 years ago

sorry @chrisvneal .. i just saw your link to the carousel docs

elementWebDev commented 6 years ago

@GWGweb-projectgroup

Just got a dynamic rating feature implemented on the product template (still in-progress). I'm doing a PR next

capture

Cynth42 commented 6 years ago

Glad you sent in your story@chrisvneal! I'm familiar with bootstrap 4, and I'm looking over Carousel docs.