How should integrate and structure Bulma folder into existing web project folder?
Webdev beginner here. I have been working on a website for a couple of weeks, and I want to start using the Bulma CSS framework and sass now.
I cloned Bulma https://github.com/jgthms/bulma into my project folder, and I see that Bulma has it's own css and sass folders.
Am I supposed to:
-put all my css, php, html, js into the Bulma folder and have it essentially become my new project folder?
-or should I just access Bulma's files through the Bulma folder, in my project folder.
I could not find any straight forward information online about how Bulma files/folders integrate into existing projects.
Here is my project folder currently:
I don't really know the best way to organize web projects, especially now adding frameworks. I can see the potential of things getting hairy, and I want to make sure I won't be slowly building a sloppy project pile that's gonna screw me over in the future, or moving folders and messing up relative addressing etc.
Thank you for your time,
Best
-Joe
css sass bulma folder-structure
add a comment |
Webdev beginner here. I have been working on a website for a couple of weeks, and I want to start using the Bulma CSS framework and sass now.
I cloned Bulma https://github.com/jgthms/bulma into my project folder, and I see that Bulma has it's own css and sass folders.
Am I supposed to:
-put all my css, php, html, js into the Bulma folder and have it essentially become my new project folder?
-or should I just access Bulma's files through the Bulma folder, in my project folder.
I could not find any straight forward information online about how Bulma files/folders integrate into existing projects.
Here is my project folder currently:
I don't really know the best way to organize web projects, especially now adding frameworks. I can see the potential of things getting hairy, and I want to make sure I won't be slowly building a sloppy project pile that's gonna screw me over in the future, or moving folders and messing up relative addressing etc.
Thank you for your time,
Best
-Joe
css sass bulma folder-structure
add a comment |
Webdev beginner here. I have been working on a website for a couple of weeks, and I want to start using the Bulma CSS framework and sass now.
I cloned Bulma https://github.com/jgthms/bulma into my project folder, and I see that Bulma has it's own css and sass folders.
Am I supposed to:
-put all my css, php, html, js into the Bulma folder and have it essentially become my new project folder?
-or should I just access Bulma's files through the Bulma folder, in my project folder.
I could not find any straight forward information online about how Bulma files/folders integrate into existing projects.
Here is my project folder currently:
I don't really know the best way to organize web projects, especially now adding frameworks. I can see the potential of things getting hairy, and I want to make sure I won't be slowly building a sloppy project pile that's gonna screw me over in the future, or moving folders and messing up relative addressing etc.
Thank you for your time,
Best
-Joe
css sass bulma folder-structure
Webdev beginner here. I have been working on a website for a couple of weeks, and I want to start using the Bulma CSS framework and sass now.
I cloned Bulma https://github.com/jgthms/bulma into my project folder, and I see that Bulma has it's own css and sass folders.
Am I supposed to:
-put all my css, php, html, js into the Bulma folder and have it essentially become my new project folder?
-or should I just access Bulma's files through the Bulma folder, in my project folder.
I could not find any straight forward information online about how Bulma files/folders integrate into existing projects.
Here is my project folder currently:
I don't really know the best way to organize web projects, especially now adding frameworks. I can see the potential of things getting hairy, and I want to make sure I won't be slowly building a sloppy project pile that's gonna screw me over in the future, or moving folders and messing up relative addressing etc.
Thank you for your time,
Best
-Joe
css sass bulma folder-structure
css sass bulma folder-structure
edited Nov 13 '18 at 23:47
Joe P
asked Nov 13 '18 at 23:32
Joe PJoe P
155
155
add a comment |
add a comment |
1 Answer
1
active
oldest
votes
Between the two choices you mention, the second is the appropriate one.
Best Practice to Organize Javascript Library & CSS Folder Structure
Web project's folders/directories structure - Best practices
There are many ways people structure their project folders. Google something like "website folder structure" and read resources like the above links to get a general idea. The two common ones are grouping files by type and by module/library. The second way is what I would recommend and is what your second choice does.
If you just need default Bulma, all you need to do is load bulma.min.css
in your web pages from wherever you've chosen to put it. So out of the entire package, that file is really the only necessary one to keep if you like (and perhaps the LICENSE
file since it requests that you do).
If you are customising Bulma, you will need to create your own sass file that should live outside the bulma
folder, and then follow the customize Bulma documentation. It would be very similar to an answer I wrote for a Bootstrap question.
1
Thank you for your reply. Ahhh ok "Instead of editing the original source, create a new source file we'll call myproject.scss, somewhere other than the Bootstrap source folder. By keeping all changes separate, we make any future Bootstrap upgrades easy." That, and the other info clarifies it for me, and was what I was looking for. So I should keep the Bulma folder (unchanged) in my project folder and then create my own sass file that will import/access things I want from Bulma. Great! I will also start following a good organization practice. Thanks! again.
– Joe P
Nov 15 '18 at 0:57
You're welcome, glad you found it helpful!
– LionelW
Nov 15 '18 at 1:00
add a comment |
Your Answer
StackExchange.ifUsing("editor", function ()
StackExchange.using("externalEditor", function ()
StackExchange.using("snippets", function ()
StackExchange.snippets.init();
);
);
, "code-snippets");
StackExchange.ready(function()
var channelOptions =
tags: "".split(" "),
id: "1"
;
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function()
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled)
StackExchange.using("snippets", function()
createEditor();
);
else
createEditor();
);
function createEditor()
StackExchange.prepareEditor(
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader:
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
,
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
);
);
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53291038%2fhow-should-integrate-and-structure-bulma-folder-into-existing-web-project-folder%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
Between the two choices you mention, the second is the appropriate one.
Best Practice to Organize Javascript Library & CSS Folder Structure
Web project's folders/directories structure - Best practices
There are many ways people structure their project folders. Google something like "website folder structure" and read resources like the above links to get a general idea. The two common ones are grouping files by type and by module/library. The second way is what I would recommend and is what your second choice does.
If you just need default Bulma, all you need to do is load bulma.min.css
in your web pages from wherever you've chosen to put it. So out of the entire package, that file is really the only necessary one to keep if you like (and perhaps the LICENSE
file since it requests that you do).
If you are customising Bulma, you will need to create your own sass file that should live outside the bulma
folder, and then follow the customize Bulma documentation. It would be very similar to an answer I wrote for a Bootstrap question.
1
Thank you for your reply. Ahhh ok "Instead of editing the original source, create a new source file we'll call myproject.scss, somewhere other than the Bootstrap source folder. By keeping all changes separate, we make any future Bootstrap upgrades easy." That, and the other info clarifies it for me, and was what I was looking for. So I should keep the Bulma folder (unchanged) in my project folder and then create my own sass file that will import/access things I want from Bulma. Great! I will also start following a good organization practice. Thanks! again.
– Joe P
Nov 15 '18 at 0:57
You're welcome, glad you found it helpful!
– LionelW
Nov 15 '18 at 1:00
add a comment |
Between the two choices you mention, the second is the appropriate one.
Best Practice to Organize Javascript Library & CSS Folder Structure
Web project's folders/directories structure - Best practices
There are many ways people structure their project folders. Google something like "website folder structure" and read resources like the above links to get a general idea. The two common ones are grouping files by type and by module/library. The second way is what I would recommend and is what your second choice does.
If you just need default Bulma, all you need to do is load bulma.min.css
in your web pages from wherever you've chosen to put it. So out of the entire package, that file is really the only necessary one to keep if you like (and perhaps the LICENSE
file since it requests that you do).
If you are customising Bulma, you will need to create your own sass file that should live outside the bulma
folder, and then follow the customize Bulma documentation. It would be very similar to an answer I wrote for a Bootstrap question.
1
Thank you for your reply. Ahhh ok "Instead of editing the original source, create a new source file we'll call myproject.scss, somewhere other than the Bootstrap source folder. By keeping all changes separate, we make any future Bootstrap upgrades easy." That, and the other info clarifies it for me, and was what I was looking for. So I should keep the Bulma folder (unchanged) in my project folder and then create my own sass file that will import/access things I want from Bulma. Great! I will also start following a good organization practice. Thanks! again.
– Joe P
Nov 15 '18 at 0:57
You're welcome, glad you found it helpful!
– LionelW
Nov 15 '18 at 1:00
add a comment |
Between the two choices you mention, the second is the appropriate one.
Best Practice to Organize Javascript Library & CSS Folder Structure
Web project's folders/directories structure - Best practices
There are many ways people structure their project folders. Google something like "website folder structure" and read resources like the above links to get a general idea. The two common ones are grouping files by type and by module/library. The second way is what I would recommend and is what your second choice does.
If you just need default Bulma, all you need to do is load bulma.min.css
in your web pages from wherever you've chosen to put it. So out of the entire package, that file is really the only necessary one to keep if you like (and perhaps the LICENSE
file since it requests that you do).
If you are customising Bulma, you will need to create your own sass file that should live outside the bulma
folder, and then follow the customize Bulma documentation. It would be very similar to an answer I wrote for a Bootstrap question.
Between the two choices you mention, the second is the appropriate one.
Best Practice to Organize Javascript Library & CSS Folder Structure
Web project's folders/directories structure - Best practices
There are many ways people structure their project folders. Google something like "website folder structure" and read resources like the above links to get a general idea. The two common ones are grouping files by type and by module/library. The second way is what I would recommend and is what your second choice does.
If you just need default Bulma, all you need to do is load bulma.min.css
in your web pages from wherever you've chosen to put it. So out of the entire package, that file is really the only necessary one to keep if you like (and perhaps the LICENSE
file since it requests that you do).
If you are customising Bulma, you will need to create your own sass file that should live outside the bulma
folder, and then follow the customize Bulma documentation. It would be very similar to an answer I wrote for a Bootstrap question.
answered Nov 14 '18 at 1:42
LionelWLionelW
19216
19216
1
Thank you for your reply. Ahhh ok "Instead of editing the original source, create a new source file we'll call myproject.scss, somewhere other than the Bootstrap source folder. By keeping all changes separate, we make any future Bootstrap upgrades easy." That, and the other info clarifies it for me, and was what I was looking for. So I should keep the Bulma folder (unchanged) in my project folder and then create my own sass file that will import/access things I want from Bulma. Great! I will also start following a good organization practice. Thanks! again.
– Joe P
Nov 15 '18 at 0:57
You're welcome, glad you found it helpful!
– LionelW
Nov 15 '18 at 1:00
add a comment |
1
Thank you for your reply. Ahhh ok "Instead of editing the original source, create a new source file we'll call myproject.scss, somewhere other than the Bootstrap source folder. By keeping all changes separate, we make any future Bootstrap upgrades easy." That, and the other info clarifies it for me, and was what I was looking for. So I should keep the Bulma folder (unchanged) in my project folder and then create my own sass file that will import/access things I want from Bulma. Great! I will also start following a good organization practice. Thanks! again.
– Joe P
Nov 15 '18 at 0:57
You're welcome, glad you found it helpful!
– LionelW
Nov 15 '18 at 1:00
1
1
Thank you for your reply. Ahhh ok "Instead of editing the original source, create a new source file we'll call myproject.scss, somewhere other than the Bootstrap source folder. By keeping all changes separate, we make any future Bootstrap upgrades easy." That, and the other info clarifies it for me, and was what I was looking for. So I should keep the Bulma folder (unchanged) in my project folder and then create my own sass file that will import/access things I want from Bulma. Great! I will also start following a good organization practice. Thanks! again.
– Joe P
Nov 15 '18 at 0:57
Thank you for your reply. Ahhh ok "Instead of editing the original source, create a new source file we'll call myproject.scss, somewhere other than the Bootstrap source folder. By keeping all changes separate, we make any future Bootstrap upgrades easy." That, and the other info clarifies it for me, and was what I was looking for. So I should keep the Bulma folder (unchanged) in my project folder and then create my own sass file that will import/access things I want from Bulma. Great! I will also start following a good organization practice. Thanks! again.
– Joe P
Nov 15 '18 at 0:57
You're welcome, glad you found it helpful!
– LionelW
Nov 15 '18 at 1:00
You're welcome, glad you found it helpful!
– LionelW
Nov 15 '18 at 1:00
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53291038%2fhow-should-integrate-and-structure-bulma-folder-into-existing-web-project-folder%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown