This is so new to me and I am little bit overwhelmed. Where should one even start to learn about how to work on a site with sage? I see there is a book which I will be purchasing, but in the mean time…
I am trying to edit an scss file (which I found) through ftp. I see that many other scss files are imported along with the main file. However, when I make a change on one of the children files, it doesn’t update in the browser. I tried clearing caches and inspecting it and I can tell nothing has changed.
I suppose I do not understand the fundamentals of sage and how to even work on it. Can someone point me in the right direction on how to edit an scss file? The site is also served through pantheon. Thank you.
No offense but it sounds like you have a lot to learn outside of the Roots stack. You need to get setup to build your project files. The book is great resource and you can also check out the docs:
Oh my gosh this is a lot. I am definitely into this and I definitely want to learn the sage stack, but it seems maybe a little bit complicated for what my job requires?
I have so much reading to do…
One more question just for some clarification: so when you say the build process is done locally, that means that i am downloading and working on the site locally and then using some type of CLI like webpack(?) to get it uploaded to the server?
Is there some protocol as to why when I FTP I can’t just edit the files on the server? Would there be any way to bypass that? The reason why I ask is that I just started a new job and inherited all these sites built with Sage, and I want to learn more, but to just make some kind of simple edit like this I have to learn so much (not complaining at all!).
Is the best way to figuring out how to go about this through the book?
Thank you for being so responsive, I know this is a lot of noobiness coming from me, so thank you for being more forgiving than the stackoverflow mods
@joshb
hey don’t worry about it josh. If I understand anything it’s that I have a lot to learn. Recently I have been learning in a react environment so my understanding of these technologies is very basic. Would you suggest the book is the best way to learn Roots? I feel like for my one simple goal I have a lot of milestones to achieve to get there.
You can’t run the build process over FTP because FTP is a file transfer protocol, not a shell; You can’t use it to run arbitrary commands on the server, which you would need to do in order to run a build. Even if you did SSH into your server to run commands, it’s unlikely that the server has the software that would be needed to run the build process (i.e. Node, yarn, etc).
There is, technically, nothing preventing you from editing the CSS file that is generated from the SCSS. Because that CSS file is the one actually loaded by the site, those changes will be reflected to visitors. However this is very very strongly not recommended for two big reasons:
As soon as you change the rendered CSS file, it is out of sync with the SCSS files that build it; there’s no way to go “backwards” and have the build process incorporate changes to your rendered CSS into your SCSS. That means that if, at some later date, you were to actually run the build process, all your CSS changes would be wiped away when the CSS is rebuilt from the SCSS. This is especially bad if the project will ever be used by someone else: They would likely have no way to know you made these changes, and would run the build process and wipe them out and then have no idea why things were broken. (Also if you’re using git to track your changes, and you should be using git to track your changes, the .gitignore in Sage doesn’t track the /dist directory where rendered assets like CSS, JS, and images end up after a build.) In general, editing on the server is cowboy coding and cowboy coding is a bad practice that will inevitably come back to bite you, your team, and anyone who works on that site in the future, in the ass.
Rendered CSS is generally minified, which can make it very difficult for a human to parse and edit.
If you absolutely must edit the CSS files and have no time or inclination to set up the build process locally and deploy from there, then I’d recommend just deleting all of the SCSS files; then at least there will be no confusion about what the source of truth is for your CSS. As with any change, please make sure you make a backup first. Using Sage this way is not what I’d call “supported,” though, and you would likely have difficulty getting troubleshooting help here.
I really, really recommend just using the build process. It’s fairly well documented, and we’re happy to answer questions here in the forums about how to get it running. There is some initial investment in time and learning to get it up and running, but it will save you time and make your life much more pleasant in the long run.
Note also that although you haven’t mentioned JavaScript, all of the above goes for JavaScript as well. Sage compiles all of the JavaScript together into a set of files in dist, and editing the non-dist JS files will have no effect unless you run a build to regenerate them.
No I definitely do not want to use a stack in a way that it was not intended to be used. I see the power of sage and that it’s efficient. Everything you said makes a lot more sense to me now. There’s a lot for me to understand and to read…my new job was asking me to work on a Sage site and now I realize that I have definitely got into some deep stuff, which I am definitely into, but I have so little time to do it.
I understand I will have to put some time into learning it. I will definitely be buying the book and spending a couple weekends on this. Thank you for giving me better clarity on what I need to do and to understand what I need to learn before I start working on it. Do you think a good starting point might be to start from the very beginning and create a demo just as like a personal sandbox learning tool so I can go through all the steps?
Then install Bedrock and lastly Sage.
Once you get to that point, open up the Sage book you can start building a theme and will be able to get a good understanding of it.
Once you do all that, then you can easily clone down the repo for your other project and get it rolling.
If I choose to develop locally, then will I have to constantly redownload and reupload the site even just for slight modifications? The way my company has our server set up is in a staging environment called Pantheon. Wouldn’t it just be better if I developed remotely?
Thank you Josh. Correct me if I am wrong, but is Pantheon essentially the same thing as purchasing a server with XYZ hosting company (deployment), staging on Github, and then developing on my local machine? I think Pantheon is what you’re describing what this Roots/Sage stack does, but if I didn’t have to use Pantheon that would be really cool. Trellis is what allows one to sync from deployment, to testing, and development (assuming what my earlier question is true)?
I am having a bit of trouble installing the Debian version of Vagrant. I downloaded the same version for both Windows and Ubuntu, but I don’t know how to install it powershell. I tried sudo apt install (filename).deb and it didn’t work. There’s nothing on the Vagrant site that shows you how to install it. What am I missing?
I got my WSL setup now, so far so good. I think I am understanding most of this.
